总结：MVVM
- M:模型Model，对应data种的数据
- V：视图View，模版
- VM:视图模型ViewModel,Vue实例对象
观察发现：
- data种所有的属性，最后都出现在vm身上。
- vm身上所有的属性及Vue原型上所有属性，在Vue模版种都可以直接使用。
示例如下所示：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Vue el data</title>
<script type="text/javascript" src="../Js/vue.js"></script>
</head>
<body>
<!-- View -->
<div id="root">
<h2> {{mydata.nickname}}</h2>
<h2> {{mydata.address}}</h2>
<hr />
<h2>
1.M:模型Model，对应data种的数据<br />
2.V：视图View，模版<br />
3.VM:视图模型ViewModel,Vue实例对象<br />
</h2>
<hr />
<h2> 表达式可应用vm种所有的内容信息，如下示例：</h2>
<h5> {{_c}}</h5>
<h5> {{$emit}}</h5>
<h5> {{1+2+3}}</h5>
</div>
</body>
</html>
<script type="text/javascript">
Vue.config.productionTip = false
// ViewModel 方式三：data的第二种书写方式，函数式
const vm = new Vue({
el: '#root',
data() {
return {
// Model
name: 'vue',
mydata:
{
nickname: 'vue.js',
address: 'xxx/前端js框架'
}
}
},
})
console.log(vm) //输出vm
vm.$mount('#root')
</script>
标签：Vue,MVVM,--,ViewModel,vm,视图,mydata,data From： https://www.cnblogs.com/YYkun/p/18027151