代码
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<!-- 留坑 -->
<div id="app"></div>
<!-- 引包 -->
<script type="text/javascript" src="vue.js"></script>
<script type="text/javascript">
// 实例化启动vue
new Vue({
el:'#app',
//目的的，可以识别类名、id名和标签名，如果做到极致优化可以直接用document.getElementById获取
template:`
<div>
<div>我这里是模板内容{{ msg }}</div>
<div>111</div>
</div>
`,//模板内容,根节点只能有一个
data:function(){
return {
msg:'Hello Vue!'
}
}
})
</script>
</body>
</html>运行后的效果
<div>
<div>我这里是模板内容Hello Vue!</div>
<div>111</div>
</div>
留坑的div[<div id="app"></div>]被屏蔽
根节点只能有一个：
<div>
<div>我这里是模板内容{{ msg }}</div>
<div>111</div>
</div>
如果是这样
<div>我这里是模板内容{{ msg }}</div>
<div>111</div>
会报错
248
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
