Vue基础之用插值表达式在视图区显示数据
第一步:当然就是你要引入Vue.js这个脚本文件啦!
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
第二步:就是你要在你HTML文件中的body中写入下面的代码:
<!-- Vue.js的应用可以分为两个重要的组成部分
一个是视图!
另一个是脚本!! -->
<!-- 下面的就是视图! -->
<div id="app">
<h1>{{message}}</h1>
</div>
<!-- 下面的就是脚本! -->
<script type="text/javascript">
//
var app = new Vue({
el:'#app', // 这个就是你要操作的元素!
data: {
message: 'lvhang'
} // data用于保存数据!插值表达式!我们在视图中声明了那些变量, 就需要在data中注册同名的变量,并且对变量进行赋值!
})
</script>