javascript - webpack中使用vue路由设置不报错,但是不能显示啊啊
高洛峰
高洛峰 2017-04-17 16:38:31
0
2
1119

设置好了vue路由,npm run dev一下,不报错,但是路由不生效啊
代码如下:

//引入路由模块
import VueRouter from 'vue-router'
//使用路由模块
Vue.use(VueRouter);
//加载组件
import home from './components/Home/home.vue';

//创建路由对象
const router = new VueRouter({
    //配置router-link 指向的路由发生变化时候,当前a标签增加的激活样式
    routes: [
        {name: 'Home', path: '/home', component: home},
    ]
})


var vm = new Vue({
    el: '#app',
    render: h => h(app),    //h 是 createElement这个函数  编译app.vue组件
    //使用路由对象
    router: router
});`请输入代码`
还有:
    <template>
    <p class="mui-content">
        home
    </p>
</template>

<script>
    export default {
        data () {
            return{

            }
        }
    }
</script>

<style scoped>

</style>
图片:
![图片描述][1]
高洛峰
高洛峰

拥有18年软件开发和IT教学经验。曾任多家上市公司技术总监、架构师、项目经理、高级软件工程师等职务。 网络人气名人讲师,...

모든 응답(2)
Ty80

이런 것 같습니다

vue-라우터

Ty80

App.vue에 코드를 게시하지 않으셨네요. 직접 작성하셨는지 모르겠네요

Vue.use(라우터)
Vue.use(Vuex)
기본 새 라우터 내보내기({
  경로: [
    {
      길: '/',
      구성요소:앱,
      리디렉션:'/in_theaters'},
    {
      경로: '/in_theaters',
      구성요소: in_theaters,
    },{
      경로: '/coming_soon',
      구성 요소:coming_soon,
    },
    {
      경로: '/top250',
      구성요소: top250,
    },
    {
    길:'*',
      리디렉션:'/'
    }
  ]
})

라우팅을 구성한 후
App.vue에서 라우팅 경로를 참조하려면 이 내용은 아마도 Home.vue가 로드되는 위치임을 의미할 것입니다.

 <el-col :md="14" :lg="18" class="content">
        <라우터-뷰></라우터-뷰>
      </el-col>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿