javascript - vue的router-link报错不显示
问题描述
我用vue-cli搭建好了目录,但是用router-link做单页路由没有成功,不知道哪里有问题求解,本人刚进坑
app.vue
<template> <p id='app'> <headers></headers> <p class='tap'><p class='tab-item'> <router-link :to='/Goods'>第一项</router-link></p><p class='tab-item'> <router-link to='/Ratings'>第二项</router-link></p><p class='tab-item'> <router-link to='/Seller'>第三项</router-link></p><router-view></router-view> </p> </p></template><script>import headers from ’./components/header/header’; export default { components:{headers }, name: ’app’,};</script>
main.js
import Vue from ’vue’import App from ’./App’import router from ’./router’Vue.config.productionTip = false/* eslint-disable no-new */new Vue({ el: ’#app’, router, template: ’<App/>’, components: { App }})
其中一个单页,其他都基本一致
<template lang='html'> <p id='ratings'><p class='heihei'> {{arr}}</p> </p></template><script> export default{name:’Ratings’,data: { arr:’afafaf’} };</script>
index.js
import Vue from ’vue’import Router from ’vue-router’import Goods from ’@/components/goods/goods’import Ratings from ’@/components/ratings/ratings’import Seller from ’@/components/seller/seller’Vue.use(Router)export default new Router({ routes: [ { path: ’/Goods’, component: Goods },{ path: ’/Ratings’, component: Ratings },{ path: ’/Seller’, component: Seller }, ]})
问题解答
回答1:<template> <p id='app'> <headers></headers> <p class='tap'><p class='tab-item'> <router-link :to='/Goods'>第一项</router-link></p><p class='tab-item'> <router-link to='/Ratings'>第二项</router-link></p><p class='tab-item'> <router-link to='/Seller'>第三项</router-link></p><router-view></router-view> </p> </p></template>
要么都写成 to=’someRoute’ 要么都写成 :to=’{path: 'someRoute'}’
回答2:index.js 里面 加上
export default router
import Vue from ’vue’import Router from ’vue-router’import Goods from ’@/components/goods/goods’import Ratings from ’@/components/ratings/ratings’import Seller from ’@/components/seller/seller’Vue.use(Router)const router = new Router({ routes: [ { path: ’/Goods’, component: Goods },{ path: ’/Ratings’, component: Ratings },{ path: ’/Seller’, component: Seller }, ]})export default router
相关文章:
1. css - .clearfix:after中为什么设置display: table2. ueditor上传服务器提示后端配置项没有正常加载,求助!!!!!3. python - 关于matplotlib的x轴显示的问题4. nginx英文文档的WebSocket proxying部分没看太明白,麻烦推荐一点中文文章5. android 文件File删除问题6. 请教: 关于 python 反斜杠转义的疑问7. angular.js - 怎样在使用ng-repeat属性的标签里面监听单个事件,使其能够单个改变CSS。8. 绝对定位和fied定位,键盘弹起对布局的影响9. javascript - vue生成一维码?求助!!!!!急10. python - Scrapy ItemLoader数据清洗疑问
