Vue

 

Vue init webpack vue1
npm install
npm run dev


npm install axios -save
npm install element-ui -save
npm install mockjs --save
npm install axios-mock-adapter

npm install babel-runtime --save

 

Vue API
https://cn.vuejs.org/v2/api/


指令
v-text
更新元素的textContent。
<span v-text="msg"></span>同<span>{{msg}}</span>

v-html
更新元素的innerHTML。
<div v-html="html"></div>

v-show
根据表达式的布尔值,切换元素的display CSS属性。

v-if
根据表达式的布尔值渲染元素。

v-else-if
表示v-if的"else if块"。可以链式调用。

v-else
为v-if或者v-else-if添加"else块"。
<div v-if="type === 'A'">
A
</div>
<div v-else-if="type === 'B'">
B
</div>
<div v-else>
Not A/B
</div>

v-for
基于源数据多次渲染元素或模板块。
<div v-for="item in items">
{{ item.text }}
</div>

v-on
缩写@。绑定事件监听器。
<!-- 方法处理器 -->
<button v-on:click="doThis"></button>

<!-- 内联语句 -->
<button v-on:click="doThat('hello', $event)"></button>

<!-- 缩写 -->
<button @click="doThis"></button>

v-bind
缩写:。动态地绑定一个或多个特性,或一个组件prop到表达式。
<!-- 绑定一个属性 -->
<img v-bind:src="imageSrc">

<!-- 缩写 -->
<img :src="imageSrc">

v-model
在表单控件或者组件上创建双向绑定。

v-pre
跳过这个元素和它的子元素的编译过程。
<span v-pre>{{ this will not be compiled }}</span>

v-cloak
这个指令保持在元素上直到关联实例结束编译。
[v-cloak] {
display: none;
}
<div v-cloak>
{{ message }}
</div>
不会显示,直到编译结束。

v-once
只渲染元素和组件一次。
<span v-once>This will never change: {{msg}}</span>

posted on 2018-10-24 15:48  lc19149  阅读(104)  评论(0编辑  收藏  举报

导航