189 8069 5689

Vue入门十三、路由的传参和取参-创新互联

1、查询参login?id=12345

配置:(传参):to="{name:'login', query:{id:'loginid'}}"
获取:(取参)this.$route.query.id

创新互联主营罗平网站建设的网络公司,主营网站建设方案,重庆APP开发公司,罗平h5微信小程序开发搭建,罗平网站营销推广欢迎罗平等地区企业咨询
2、路由参数

配置:(传参):to="{name:'login', params:{id:'loginid'}}"
获取:(取参)this.$route.params.id

3、路径参数register/registerid/info

配置:(传参):to="{name:'register', params:{id:'registerid'}}"
配置路由规则:
routes: [{path: '/register/:id/info', name: 'register', component: Register}]
获取:(取参)this.$route.params.id

4、使用props直接取参

配置:(传参):to="{name:'propsParams', params:{id:'propsParamsId'}}"
配置路由规则:
routes: [
// 通过props传值
{path: '/propsParams', name: 'propsParams', props: true, component: PropsParams}]
获取:(取参)

 var PropsParams = {
        template: `
                
传参直接取值
直接拿到ID:{{id}}
`, // 直接通过props取参 props: ['id'] }
5、通过JS进行传参

this.$router.push({path: '/login', name: 'login', query: {id: 'loginidjs'}})

代码示例:

query传参:




    
    Title


params传参




    
    Title


params路径传参




    
    Title


params使用props直接取参




    
    Title


js传参




    
    Title


fullPath路由全路径监听




    
    Title


完整代码示例:




    
    Title


另外有需要云服务器可以了解下创新互联cdcxhl.cn,海内外云服务器15元起步,三天无理由+7*72小时售后在线,公司持有idc许可证,提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案,具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势,专为企业上云打造定制,能够满足用户丰富、多元化的应用场景需求。


新闻标题:Vue入门十三、路由的传参和取参-创新互联
文章网址:http://cdxtjz.cn/article/cohdig.html

其他资讯