极客观点
项目管理
HarmonyOS
在学习vue-router简单的例子的时候，发现组件内的data数据无法显示在页面中，也没有报错，请问这是什么原因呢？
这是html文件
<body>
<div id="app">
<h1>简单的vue-router例子</h1>
<p>
<router-link to='/home'>首页</router-link>
<router-link to='/pageone'>page1</router-link>
</p>
<router-view></router-view>
</div>
</body>
这是js文件
import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from './vue/home.vue'
import Pageone from './vue/pageone.vue'
Vue.use(VueRouter);
const routes=[
{path:'/home',component:Home},
{path:'/pageone',component:Pageone}
];
const router=new VueRouter({routes})
const app=new Vue({
router
}).$mount('#app')两个vue文件分别是
home.vue
<template>
<div>{{ msg }}</div>
</template>
export default {
data () {
return {
msg: '这是home'
}
}
}
pageone.vue
<template>
<div>pageone</div>
</template>
export default{
name:'pageone',
data(){
return {
mag:'这是pageone'
}
}
}浏览器中没有报错，但是显示为
点击首页
点击page1
所以无法显示home.vue中的data数据，请问是因为什么问题呢？
你的vue中js部分没有添加