Vue.js 第一篇学习笔记
Posted xinfang
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了Vue.js 第一篇学习笔记相关的知识，希望对你有一定的参考价值。
最近开始学习Vue, 比预计的难度要低太多了，大概是了解了一些JAVA和设计模式的结果吧。haha ...下文都是个人理解，不确定是否是事实。
模模糊糊地觉得 Vue的确比jQuery要方便。
Vue ，貌似是这样的。
先初始化，new Vue()
内部是一个对象，
new Vue({})
对象可以有3种或者更多子对象。————表示目前我只看到3种。
分别为
1、el:{}， ——————用ID等？绑定html上的元素，貌似也是用CSS选择器？
2、data:{}， ——————似乎是需要装静态变量，string之类的样子格式例如 :myString:"String",
3、methods:{} ——————大概内部装各种function。格式例如 :myFunc:function(){} // 还是对象内的函数的格式的哦。
值得注意的是，使用this可以获取Vue内部的任何变量 varible。但是如果在function 内部对this.varible有定义的话，会覆盖data里面的。可以用v-once 避免覆盖。
定义静态变量是在data里面，比如：
data:{ xx = 0, yy=0 }, methods:{ updataX:function(){ this.xx++; }, updataY:function(){ this.yy++; } }
流程貌似是 functionupdataX,Y 操作 xx,yy 这类静态变量，然后结果就自动更新到HTML页面上————大概就是这样所以不需要操作DOM。
HTML：
<p>
{{xx}}{{yy}}
</p>
<!--HTML上使用的Vue自带的方法：
v-html Vue的内容作为HTML使用。
v-bind 绑定属性到Vue的内容
v-once 保持data里面的内容不被覆盖。
v-on:click="function" ， 为这个元素绑定onclick 等等
Vue 自带的变量$event 也可以作为参数传递给函数的。只要在绑定的时候加（$event ）就可以用诸如 e.clientX ; e.stopPropagation 之类的了。
Vue 自带stopPropagation的功能，一个栗子： v-on:click="updataX(arg，$event).stop"
还有preventDefault, v-on:mouseover="function($event).prevent"
-->
以上是关于Vue.js 第一篇学习笔记的主要内容，如果未能解决你的问题，请参考以下文章