在我的main.js文件中注册了组件‘runoob’但是在最终展示的页面上始终不展示。
index.html内容如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>element-starter</title>
</head>
<body>
<p> new tag should be in the following</p>
<div id="app3">
<runoob></runoob>
</div>
</body>
</html>
main.js内容如下:
import Vue from 'vue' // 引入 vue
// 注册
Vue.component('runoob', {
template: '<h1>自定义组件!</h1>',
data() {
return {
msg: '注意:组件的data必须是一个函数!!!'
}
}})
// 创建根实例
new Vue({
el: '#app3',
})
我是利用了element-starter-master这个项目创建项目目录的。目录如下:
最终的渲染结果如下,其中<div id=‘app3’>
这个DOM元素直接消失了: