刚接触vue不久,就遇上了tab(之前只用过js),在查阅网上资料并运行代码后,发现用router跳转和直接components选择切换是最普遍的方法。以下代码是在原本大佬的基础上修改的,就不作为原创啦,但原文网址找不到啦,现在作为一个简单的笔记记录一下(毕竟真的很简单且常用)。
一、通过router跳转
1.app.vue 总的router-view设置
<template>
<div id="app">
<router-view></router-view>
<tabbar v-if="$route.meta.showTab"></tabbar>
</div>
</template>
<script>
import Tabbar from "./components/Tabbar";
export default {
name: "app",
created: function () {
this.$router.push("/");
},
components: {
Tabbar,
},
};
</script>
1.main.js中引用
import Vue from "vue";
import App from "./App.vue";
import router from "./router/index.js";
import VueRouter from "vue-router";
import MintUI from "mint-ui";
import "mint-ui/lib/style.css";
import axios from "axios";
import ElementUI from "element-ui";
import "element-ui/lib/theme-chalk/index.css";
import Vant from "vant";
import "vant/lib/index.css";
import VueResource from "vue-resource";//上下包含了其他组件库,按需引入
Vue.use(VueResource);
Vue.use(Vant);
Vue.use(ElementUI);
Vue.prototype.$