上期咱们聊到了mvvm模型，这一期咱们来聊一下vue的实例，这个是个很重要的东西，千万别轻视了，下面开始：
目标：1 了解实例中的data用法和method用法
最基本的实例是什么样子的呢，是这样的啦：
- el: 表示要操作的页面元素, 必填参
- data: 数据, 可以理解为面向对象中的”属性“，他主要是存储数据的，当程序运行时，监控页面传来的数据，进行修改，启动时根据他的数据渲染页面。
- methods: 方法, 可以理解为面向对象中的”方法“，根据方法可以改变属性的值，从而改变页面，请求交互，一系列的操作
这样理解是不是就很清楚啦？
为了再详细解释一下这个概念，咱们来做一个练习：
这个练习很经典，就是实现一个加法器，比如左边两个输入框，右边为结果框，当左边输入时点击等于=号，计算结果：
目的：锻炼data和method的理解，下面开始我的表演：
本文转载自：https://www.gylmap.com
图片在这里，该肿么办呢？那按照步骤来吧！
1 先创建html文件，命名method.html
2 完成上文提到的vue三部曲（这个一定要掌握，后面项目要用到）
3 vue三部曲搞完之后搞页面，创造三个input框，一个按钮
4使用v-model绑定属性
5 绑定方法
这样就可以算出来啦！
总结：通过两个input框绑定数值，这样当input框输入值时，通过v-model绑定了值，在等于号加上方法，当输入值时，点击等于号，调用方法，这样双向绑定的方法会计算出来！
秒鲨号所有文章资讯、展示的图片素材等内容均为注册用户上传(部分报媒/平媒内容转载自网络合作媒体)，仅供学习参考。用户通过本站上传、发布的任何内容的知识产权归属用户或原始著作权人所有。如有侵犯您的版权，请联系我们反馈！本站将在三个工作日内改正。
