Vue学习笔记

    1.想让Vue工作,就必须创建一个 vue实例,且要传入一个配置对象 el data ;

    2.root容器里的代码依然符合html规范,只不过混入了一些特殊的vue语法 ;

    3.root容器里的代码称为[vue模板]

    4.vue实例和容器是一一对应的 的数据发生变化,那么模板中用到该数据的地方也会自动更新

    5.真实开发中只有一个vue实例,并且会配合着组件一起使用

    6.{{xxx}} 中的xxx是js表达式 ,且xxx可以自动读取到data中的所有属性;

     7. 一旦data 中的数据发生变化,那么该模板中用到该数据的地方也会自动更新;

    注意区分js表达式和js代码(语句)

    1.一个表达式会产生一个值,可以放在任何一个需要值得地方

    (1).a

    (2)a+b

    (3)demo(1)函数调用表达式  

    (4)x===y ? 'a' :'b'               三元表达式  三目表达式    

    2.js代码 语句

    (1) if(){} 控制走不走

    (2)for(){} 控制走几次

1 vue 是什么

3 简介型的javascript框架    个人开发 (刘雨溪)

 4 

 5  特点：mvvm       m=mvc   module 模型   v=view 视图    c=controller  控制器

 6   mvvm       m=mvc   module 模型   v=view 视图     vm (视图与数据之间的传递)

 7  vue1 双向数据绑定   vue2 单向数据流

 8     单页面应用

13 v-model   数据绑定

14 data  返回对象用 return

16 v-for   循环   格式  v-for="字段名 in(of) 数组json"

18 v-show   显示 隐藏     传递的值为布尔值  true  false  默认为false20 v-if   显示与隐藏     和v-show对比的区别 就是是否删除dom节点   默认值为false

22 v-else-if  必须和v-if连用

24 v-else  必须和v-if连用  不能单独使用  否则报错   模板编译错误

26 v-bind  动态绑定  作用： 及时对页面的数据进行更改

30 v-on 绑定事件  函数必须写在methods里面

31 @click  快捷方法

33 v-text  解析文本

35 v-html   解析html标签

37 v-bind:class   三种绑定方法  1、对象型  '{red:isred}'  2、三目型   'isred?"red":"blue"'   3、数组型  '[{red:"isred"},{blue:"isblue"}]'

39 v-once  进入页面时  只渲染一次 不在进行渲染

41 v-cloak  防止闪烁

43 v-pre  把标签内部的元素原位输出