zoukankan      html  css  js  c++  java
  • vue的页面跳转方式和传值、取值[zhuan]

    1、通过router-link进行跳转,传递方式:

    使用query传递参数,路由必须使用path引入,

    使用params传递参数,路由必须使用name引入

    <router-link :to="{path: '/home', query: {key: 'hello', value: 'world'}}">

      <button>跳转</button>

    </router-link>       

    跳转地址 ====> /home?key=hello&value=world

    取值 ====> this.$route.query.key

    <router-link :to="{name: '/home', params: {key: 'hello', value: 'world'}}">

      <button>跳转</button>

    </router-link>  

    跳转地址 ====> /home ??? (暂时没用过)

    取值 ====> this.$route.params.key

    2、$router方式跳转

    this.$router.path({

      path: '/detail',

      query: {

        name: 'admin',

        code: 10021

      }

    });

    跳转地址 ====> /detail?name=admin&code=10021

    取值 ====> this.$route.query.name

    刷新参数还在

    this.$router.path({

      name: 'detail',

      params: {

        code: 10021

      }

    });

    跳转地址 ====> /detail/10021

    取值 ====> this.$route.params.code

    刷新参数不在

  • 相关阅读:
    CSS基本
    Visual Basic相关图书推荐
    Docker相关图书推荐
    PASCAL相关图书推荐
    正则表达式相关图书推荐
    Go语言相关图书推荐
    F#相关图书推荐
    Ruby相关图书推荐
    PHP相关图书推荐
    Swift相关图书推荐
  • 原文地址:https://www.cnblogs.com/janeaiai/p/13490580.html
Copyright © 2011-2022 走看看