问题
插值语法不生效,如图:
错误1
引入 Vue
和使用 Vue
应放在两个标签内
错误示例
<script type="text/javascript" src="./vue.js">
Vue.config.productionTip = true
const x = new Vue({
el: '#root',
data: {
name:"zjh"
}
})
</script>
正确示例
<script type="text/javascript" src="./vue.js"></script>
<script type="text/javascript">
Vue.config.productionTip = true
const x = new Vue({
el: '#root',
data: {
name:"zjh"
}
})
</script>
错误2
使用 Vue
的 javascript
代码应放在 body
的尾部
错误示例
<html>
<head>
<script type="text/javascript" src="./vue.js"></script>
<script type="text/javascript">
Vue.config.productionTip = true
const x = new Vue({
el: '#root',
data: {
name:"zjh"
}
})
</script>
</head>
<body>
<div id="root">
Hello, {{name}}
</div>
</body>
</html>
正确示例
<html>
<head>
<script type="text/javascript" src="./vue.js"></script>
</head>
<body>
<div id="root">
Hello, {{name}}
</div>
<script type="text/javascript">
Vue.config.productionTip = true
const x = new Vue({
el: '#root',
data: {
name:"zjh"
}
})
</script>
</body>
</html>