vue 链接方式

query传参 参数在地址栏中显示 刷新不丢失

 <router-link
      v-for="(menu,index) in currentMenuList"
      :key="index"
      :to="{ name: menu.linkName, query: menu.params }"
  >
      <li :class="{ active: show == index }">{{ menu.name }}</li>
  </router-link>

数据

const menuList = reactive([
    { name: 'menu1', link: '/asset/menu1', linkName: 'menu1', params: {}, pid: 'fwtd' },
    { name: 'menu2', link: '/asset/menu2', linkName: 'menu1', params: {}, pid: 'fwtd' },
    { name: 'menu3', link: '/asset/menu3', linkName: 'menu1', params: {}, pid: 'fwtd' },
    { name: 'menu4', link: '/asset/menu4', linkName: 'menu1', params: {SJDM:'SZ0008' }, pid: 'other' },
    { name: 'menu5', link: '/asset/menu4', linkName: 'menu1', params: {SJDM:'SZ0015'}, pid: 'other' }, 
])

params传参
刷新页面参数丢失

<router-link :to="{ name: 'menu1', params: { type: 0 } }">
    <li>1111</li>
  </router-link>

直接写路径的方式

<router-link to="/pmenu/menu">
  <li>menu</li>
</router-link>

name方式

<router-link :to="{ name: 'menuName', query: { P: '1111' } }">
  <li>menu</li>
</router-link>