VUE基礎知識

1、全域性定義：每個元件的命名不可重複

2、字串模板：缺乏語法高亮，可讀性較差

（1）屬性

屬性書寫方式

props:

["type"
,"name"
,...
]

list:

（2）事件

（3）插槽

插槽是元件的一塊html模板，其顯示與否由父元件決定。

//父元件

="father"
>
這裡是父元件<
/h3>
<
!--第一次使用：用flex展示資料--
>
"user"
>
="tmpl"
>
for=
"item in user.data"
>
}<
/span>
<
/div>
<
/template>
<
/child>
<
/div>
<
/template>

//子元件

="child"
>
這裡是子元件<
/h3>
// 作用域插槽
"data"
>
<
/slot>
<
/div>
<
/template>
export
default
}}

同層比較的機制，同一層級的一組節點可以使用唯一的id進行區分。

當頁面資料發生改變的時候，如果節點型別不同，則直接刪掉前面的節點，建立並插入新的節點，如果節點型別相同，則重新設定相應的屬性，進行節點的更新。

key屬性的引用（相同節點的移動，key的存在使得節點可以移動而不用刪除）

當資料有變化時才會觸發計算屬性computed，相對方法效能較好。

偵聽器watch

盡量使用計算屬性完成。

v-text

v-html
v-show
v-if v-
else
-if v-
else
v-for
v-bind（：）
v-on（@）
v-model
v-pre：繞過`}`
編譯直接輸出字串
v-once：繫結的變數只會解析一次
v-cloak

Vue基礎知識

vue.js的基本使用 1.引入vue.js 1 cdn 3 模組化安裝 npm i vue d s cnpm i vue yarn add vue 2.初始化vue 1 必須有乙個html容器，決定vue.js的作用範圍 2 初始化 new vue options data 資料 3 資料繫結 宣...

Vue基礎知識

資料雙向繫結 指令帶有v 的，表示vue特有的屬性，他們會在渲染的dom上，應用特殊的響應式行為 或者 click me v model 會忽略所有表單元素的 value checked selected attribute 的初始值 而總是將 vue 例項的資料作為資料 你應該通過 j ascri...

vue基礎知識回顧

vue主旨 運算元據，不操作dom 元件 例項 1 兩種安裝方式 a，script引入 b，使用v cli腳手架搭建模組化專案 2 掛載點 模板與例項 3 vue例項中的資料data 事件 事件 click.方法 methods 4 vue中的屬性繫結 屬性名 和雙向資料繫結 v model 5 v...