经历过一周我又继续和这个vue磕上了，我想这次得有点收获了吧......
1.来点知识点
console.dir()可以显示一个对象所有的属性和方法;
测试一段代码执行时间：
console.time('test');
/* 这里运行待测代码 */
console.timeEnd('test');
2.vue概述：
Vue主要是“面向数据”编程。当数据发生改变时使用虚拟DOM来更改某一DOM节点，避免将整个页面渲染.
Vue特色—数据双向绑定：数据模型(model)与视图(view)组件的自动同步。
Vue特色—声明式渲染：数据模型(model)与视图(view)组件的自动同步。
声明式
只需要声明在哪里（where）做什么（what），而无需关心如何实现（how）
3.Vue指令
指令：
是一种特殊的自定义行间属性（也就是在html标签内写）；指令的职责就是当其表达式的值改变时相应地将某些行为应用到DOM上，在Vue中，指令以“v-”开头
4.
1. html模版
html模版：基于DOM的模版，模版都是可解析的有效的HTML
插值：
文本：使用“Mustache”语法（大括号）{{ value }}；作用：替换实例上的属性值，当值改变时，插值内容会被自动更新。也可使用v-text="value"代替。
原生的html：双大括号输出的文本，不会解析html标签。也就是说当实例的data为html标签时，不能解析而是直接输出出来。此时如想要解析，可使用v-html="value"代替。
<p>{{ value }}</p> === <p v-text="value"></p>
需要注意的是，有时候因为一些网络延迟等原因，用户会在也买年中先看到{{ xxx }}，然后才有数据。我们若想避免此效果，可用v-text="xxxx"代替。
想要解析，可使用v-html="value"代替。
使用javascript表达式：可以写简单的表达式。（可以简单的三目运算，但是不可以写if语句），以后会有计算属性。
{ 1+2 }
{ true? "yes":"no" }
2.字符串模版
template字符串
tempalte => 选项对象的属性
模版将会替换挂载的元素。挂载元素的内容都会被忽略，根节点只有一个，将html结构写在一对script标签中，设置type="x-template"。
3种方式字符串模版:
第一种方式
第一种方式结果
说明权重比较高，直接“代替”挂载点，把原来的html替换后显示。
第二种方式
第3种方式
网友评论