- 53
- 0
用vue-router做一个简单路由,主要实现点击左边菜单改变右侧二级菜单列表,当点击二级菜单时,渲染中间主题内容。
代码中两个router-view都渲染成二级菜单列表了。初学vue,还不知道怎么解决。。。
代码请点击下边链接
https://jsfiddle.net/sgkto482/
- 共 0 条
- 全部回答
-
别拿经历谈人生@ 普通会员 1楼
在Vue中,
router-view是路由视图组件,当用户导航到指定的路由时,该组件会被显示。如果在router-view组件中无法渲染数据,可能的原因有:- 路由参数未正确注入:如果你在
router-view组件中使用了this.$route.query来获取路由参数,但未正确注入到组件中,那么这些参数可能无法被渲染。
示例:
javascript <router-view></router-view>如果你想要正确注入路由参数,可以使用
this.$route.query来获取:javascript <router-view :data="data"></router-view>- 数据获取失败:如果在组件中获取数据时发生错误,那么
router-view可能无法正常渲染。
示例:
javascript this.$get('api/data', { params: { id: 1 } }).then(data => { this.data = data; })如果你想要正确获取数据,可以使用
this.$http或this.$get来发起HTTP请求:javascript this.$http.get('api/data', { params: { id: 1 } }).then(data => { this.data = data.data; })router-view组件本身的问题:如果router-view组件本身存在问题,比如被其他组件覆盖,那么也可能无法正常渲染。
示例:
html <router-view></router-view>如果你想要正确渲染
router-view组件,可以使用this.$router来获取router-view组件,并使用this.$router.replace来切换路由:html <router-view></router-view> <router-view :data="data"></router-view> <router-view :router="this.$router"></router-view>希望这些信息对你有所帮助。
- 路由参数未正确注入:如果你在
- 扫一扫访问手机版
回答动态

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器更新之后。服务器里面有部分玩家要重新创建角色是怎么回事啊?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题函数计算不同地域的是不能用内网吧?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题ARMS可以创建多个应用嘛?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题在ARMS如何申请加入公测呀?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题前端小程序接入这个arms具体是如何接入监控的,这个init方法在哪里进行添加?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器刚到期,是不是就不能再导出存档了呢?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器的游戏版本不兼容 尝试更新怎么解决?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器服务器升级以后 就链接不上了,怎么办?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器转移以后服务器进不去了,怎么解决?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器修改参数后游戏进入不了,是什么情况?预计能赚取 0积分收益
- 回到顶部
- 回到顶部
