安装先不详讲，先直接引入官方cdn
<script src="https://cdn.jsdelivr.net/npm/vue"></script>数据驱动视图vue 实例
大量vue视频教程请加群：{{ name }}
我要评论
<script type="text/javascript">
// 这是我们的 Model
let model = {
name: "347615774"
}
// 创建一个 Vue 实例或 "vm"
// 它连接 View 与 Model
let vm = new Vue({
el: '#app',
data: model
})
</script>
我们通过new Vue( )创建一个实例vm，参数是一个json对象，属性el提供一个在页面上存在的DOM 元素(id=’app’)，表明这个实例是关联指定的DOM节点。
页面渲染如下：
在此过程中，我们并没有写过操作DOM节点的代码，在MVVM模式中的viewModel充当着监控者的角色，假如它监控到model数据发生了变化，便会通知view视图进行更新，这个过程并不需要你去参与。
一旦name的值被改变了，页面上立马跟着发生了变化，而不需要你再写innerHTML去更新视图了
<p id="app">
<input v-model="name"/></br>
大量vue视频教程请加群：{{ name }}
</p>
<script type="text/javascript">
let model ={
name: "347615774"
}
let vm = new Vue({
el: '#app',
data: model
})
</script>
如对本文有疑问， 点击进行留言回复！！
egg项目npm/cnpm出错Connect timeout
网友评论