今天做页面跳转的时候遇到了一个问题,uni.navigateTo 方法不是万能的 🤔

我的需求是在一个component目录下的一个组件中点击遍历出来的组件进入另一个组件,我觉得有点绕,所以我把将要跳转的详情页放到了pages目录下并注册了页面(没有配置tabbar)

演示

没错,就是这张图,我想要点击菜品跳转到对应详情页,可是 uni.navigateTo 不能进行跳转,我使用了 fail 回调函数发现无法找到页面路径

重点来了:将跳转的页面需要在pages配置文件中进行页面的注册

那么接下来呢?我可是在推荐页面的子组件中呀,不是在推荐本页面,所以我觉定使用Vue的 .$parent ,没错,我要子组件控制父组件方法的执行 😁

		methods: {
			listNavTo(id) {
				this.$parent.$parent.listNavTo(id)
			}
		}
		<view class="food_list" v-for="list in foodList" :key="list.id" @click="listNavTo(list.id)">
// food_list指向index组件页面实现跳转
			listNavTo(id) {
				console.log(id)
				uni.navigateTo({
					url:"/pages/food_info/food_info",
					fail(err) {
						console.log(err)
					}
				})
			}

这确实可行 😆

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐