适合读者：
了解 MV* 架构模式
希望了解双向绑定原理
从MVC、MVVM说起
参考阮一峰老师的文章：http://www.ruanyifeng.com/blog/2015/02/mvcmvp_mvvm.html
流程：View根据Model展示页面，当页面发生操作时（commander），View传递指令到Controller层，Controller层根据commander对Model做出修改，Model发生变化后，通知View重新渲染。
流程：Model传递到ViewModel层进行对应逻辑运算后同步到View上，同时View与ViewModel绑定，View的任何变动都反映在ViewModel上，ViewModel变更时，会通知Model做出变更。View与Model层不发生通信。
单向绑定与双向绑定
从上边MVC与MVVM模型图可以看出，MVC模型根据Model渲染View，Model向View单向通信，理解为单向绑定；
MVVM模型View与ViewModel绑定，双方的任何变更均能反映到另一方，View的任何变更由ViewModel向Model通报，同时Model的变更向ViewModel通报，ViewModel与View同步。
双向绑定的应用场景
一句话概括： 双向绑定试用于所有UI控件，对非UI控件，当组件间通信时，可采用双向绑定，也可采用单向绑定。
参考文章：单、双向绑定分析对比 https://www.wang1314.com/doc/topic-20437069-1.html
模仿双向绑定
<template><div class="hello"><p> 双向绑定</p><h1>{{price}}</h1><h1>{{ tax }}</h1><h1>{{ total }}</h1><input v-model="price"/><button @click = "clickBtn()">改变价格</button></div>
</template>
<script>export default {name: 'HelloWorld',data: function (){return 
