首页 > web前端 > js教程 > 正文

Vue.js路由的其他操作

php中世界最好的语言
发布: 2018-03-13 14:41:28
原创
1115 人浏览过

这次给大家带来Vue.js路由的其他操作,使用Vue.js路由其他操作的注意事项有哪些,下面就是实战案例,一起来看一下。

基于当前路径下,跳转到apple

   to apple
    上面的和下面的区别    to banana
登录后复制

如果要跳到根目录,在apple前加/

   to apple
    上面的和下面的区别    to banana
登录后复制

如果绑定的话,我们也可以动态的修改路径

登录后复制

如果绑定的话,不想动态修改路径,我们也可以直接写死,

注意:apple一定要用单引号括起来,不然他会去data里面找apple,会报找不到对象的error

to apple
登录后复制

也可以传递参数

to banana
登录后复制

通过tag,将link变成li标签,当然也可以设置变成其他标签

to apple
登录后复制

*以上都属于声明式导航
下面感受下编程式导航
可以通过push,跳转到特定的页面

router.push('apple')
或者
router.push({path: 'apple'})
或者name
......
登录后复制

应用场景:
当我们每次路由切换的时候,为他设置一些操作

比方说:检查用户的登录状态,如果用户未登录,就通过编程式导航跳转到登录界面
router.beforeEach(router.push('登录界面'))

相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!

推荐阅读:

Vue.js的vue标签属性和条件渲染

Vue.js的列表渲染 v-for 数组 对象 子组件

使用Vue.js有哪些注意事项

以上是Vue.js路由的其他操作的详细内容。更多信息请关注PHP中文网其他相关文章!

相关标签:
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责声明 Sitemap
PHP中文网:公益在线PHP培训,帮助PHP学习者快速成长!