设置路由界面router.js
import 和 设置 routes
import Vue from 'vue'
import vuerouter from 'vue-router'
import firstpage from '../components/routerpage/index'
import active from '../components/routerpage/active.vue'
let router=new vuerouter({
mode:"history",
routes:[
//配置路由
{
path:"/",
name:"firstpage",
component:firstpage
},{
path:"/active",
name:"active",
component:active
}
]
});
Vue.use(vuerouter);
export default router;
对应action
{
title: "电影",
img: "../../../public/img/ymiao.png",
activeimg: "../../../public/img/miao.png",
action: "/",
useractive: true
},
{
title: "活动",
img: "../../../public/img/yshu.png",
activeimg: "../../../public/img/shu.png",
action: "/active",
useractive: false
},
设置routerlink
<router-link :to="item.action">
<img class="img" :src="`public/img/${item.useractive?item.img:item.activeimg}`" alt="">
<br>
{{item.title}}</router-link>