vue.js怎么进行页面跳转?

vue.js怎么进行页面跳转?

本教程操作环境:windows7系统、vue2.9版,该方法适用于所有品牌电脑。

vue跳转页面的方法

1:router-link跳转

     

登录后复制

2:this.$router.push()

立即学习“前端免费学习笔记(深入)”;

 

  

export default{ name:'test', methods:{ goTo(){ //直接跳转 this.$router.push('/testDemo'); //带参数跳转 this.$router.push({path:'/testDemo',query:{setid:123456}}); this.$router.push({name:'testDemo',params:{setid:111222}}); } } }

登录后复制

params和query传参数有什么不一样??在地址栏中可以看到,params传参数时,地址栏中看不到参数的内容,有点像ajax中的post传参,query传参数时,地址栏中可以看到传过来的参数信息,有点像ajax的个体传参

如果单独传setId一个参数的时候,地址栏中的地址如下图:

1.png 

第一种方式:path – query 传参

2.png

第二种方式:name – params传参数

但是一般情况下,传参数是传递一个对象,当传递的是一个对象的时候,地址栏中的地址如下图:

3.png 

第一种方式:path – query 传参

4.png 

第二种方式:name – params传参数

微风轻轻的吹来,带来了一丝丝凉意

var vm = new Vue({el: '#app',data: {isShow:true},methods:{show:function(type){if(type){this.isShow = true;}else{this.isShow = false;}}}})

登录后复制

更多编程相关知识,请访问:编程学习课程!!

以上就是vue.js怎么进行页面跳转?的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/3021654.html

(0)
上一篇 2025年3月13日 05:47:40
下一篇 2025年3月13日 05:47:49

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • 如何解决vue 引入字体css报错问题

    vue引入字体css报错的解决办法:1、在用到的地方引入字体的样式文件;2、把“font.styl”改为“font.css”;3、把存放字体的font文件夹移动到和src平级的static文件夹中。 本教程操作环境:windows7系统、v…

    2025年3月13日 编程技术
    200
  • 在vue中怎么定义自定义组件

    在vue中定义自定义组件的方法:首先创建一个loading效果组件;然后创建一个相关的【.js】文件;最后将组件插入【】标签里即可。 本教程操作环境:windows7系统、Vue2.9.6版,Dell G3电脑,该方法适用于所有品牌电脑。 …

    2025年3月13日 编程技术
    200
  • vue界面刷新不显示怎么办

    vue界面刷新不显示的解决办法:首先打开相应的代码文件;然后在vue中使用“this.$router.go(0)”和“location.reload()”;最后利用控制“”的显示隐藏来实现整个页面刷新即可。 本教程操作环境:Windows7…

    2025年3月13日
    200
  • vue $on是什么意思

    vue中“$on”指的是一个方法,语法如“Event.$on(‘msg’,function(msg){…}”,其中第一个参数是数据的名字,与发送时的名字对应,第二个参数是一个方法,要对数据的操作。 本教程…

    2025年3月13日
    200
  • vue中elementUI是什么

    vue中elementUI是基于vue实现的一套不依赖业务的UI组件库,提供了丰富的PC端组件,减少用户对常用组件的封装,降低了开发的难易程度。 本文操作环境:windows10系统、vue 2.9、thinkpad t480电脑。 【相关…

    2025年3月13日
    200
  • 了解Vue中的自定义指令

      除了默认设置的核心指令( v-model 和 v-show ),Vue 也允许注册自定义指令。在Vue里,代码复用的主要形式和抽象是组件。然而,有的情况下,仍然需要对纯 DOM 元素进行底层操作,这时候就会用到自定义指令。本文将详细介绍…

    2025年3月13日
    200
  • vue如何给组件加css样式

    vue给组件加css样式的方法:首先在【.vue】文件中设置相关代码;然后新建【index.js】文件,并建立对应的【record.scss】文件即可。 本教程操作环境:windows7系统、Vue2.9.6版,Dell G3电脑。 【相关…

    2025年3月13日
    200
  • vue.use怎么用

    vue.use的使用方法:首先打开相应的代码文件;然后通过全局方法“Vue.use()”使用插件,其语法如“vue.use(plugin, arguments)”。 本教程操作环境:windows7系统、vue2.0版,Dell G3电脑。…

    2025年3月13日
    200
  • vue.js组件化是什么意思

    vue.js组件化用于将UI页面分割为若干组件进行组合和嵌套;组件化是一种高效的处理复杂应用系统,更好的明确功能模块作用的方式;目的是为了解耦,把复杂系统拆分成多个组件,分离组件边界和责任,便于独立升级和维护。 本教程操作环境:window…

    2025年3月13日
    200
  • vue.js支持ie9吗

    vue.js支持ie9,因为Vue官方对于ie浏览器版本兼容情况的描述是“ie9+”,即是ie9及更高的版本;经过测试,Vue的核心框架vuejs本身,以及生态的官方核心插件均可以在ie9上正常使用。 本文操作环境:Windows7系统、D…

    2025年3月13日
    200

发表回复

登录后才能评论