iview tabs 切换到到指定的页面

图片描述

图片描述

谁能知道用ivew的tabs组件,能直接从其他页面跳转到tab的第二页吗?我现在目前这样写的用router push是跳不过来啊

阅读 8.5k
3 个回答

我这里是把mounted里面的方法写到created里就可以了

路由配置

const routes = [
  { path: "/", component: Home },
  
  // 确保这里你没有配置错
  { path: "/tabs/:paramName", component: Tabss }

  // 推荐query方式
  // { path: "/tabs", component: Tabss }
];

跳转链接

<router-link to="/tabs/name2">跳转到指定Tab</router-link>

// 推荐query方式
<!-- <router-link to="/tabs?paramName=name2">跳转到指定Tab</router-link> -->

页面赋值

export default {
  data() {
    return {
      paramName: "name1"
    };
  },
  mounted() {
    this.paramName = this.$route.params.paramName;
    // 推荐query方式
    // 路由跳转是 /tabs?paramName=name2
    // if (this.$route.query.paramName != undefined) {
    //   this.paramName = this.$route.query.paramName;
    // }
  }
};

预览链接

点击查看

直接在钩子函数中设置'pageName'的值,就会自动显示第二个tab页内容

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题