创建了一个vue新项目,TestView.vue是我新增的,其它是通过脚手架创建自动生的。TestVIew页面配置了路由,但是页面跳转的时候渲染不出来,不清楚是什么原因。
父组件
<template>
<div class="home">
这个页面都不渲染
<TestHello :msg="msg" />
</div>
</template>
<script>
// @ is an alias to /src
import TestHello from '@/components/TestHello.vue'
export default {
name: "TestView",
components: {
TestHello // 要被引用一下否则会报错
},
data() {
return {
msg: "hello 这是主页",
};
},
};
</script>
子组件
<template>
<div class="home">
hello 这是主页{{ msg }}
</div>
</template>
<script>
export default {
name: "TestHello",
props: {
msg: String
},
};
</script>
配置的页面
配置的路由
最后testview就是不展示
上述问题的解决方案是:
因为这个import不需要这个{ }这是导入模块需要的,去掉这个{ }效果就出来了。