當獲取到後端資料後，我們會把它按照一定的規則載入到寫好的模板中，輸出成在瀏覽器中顯示的 html，這個過程就稱之為渲染。而 vue.js 是在前端（即瀏覽器內）進行的模板 渲染。
1.前後端渲染對比
前端渲染 的優勢：是在瀏覽器裡利用 js 把資料和 html 模板進行組合，業務分離，後端只需要提供資料介面。
2.條件渲染
（提供指令來說明模板和資料間的邏輯關係）
v-if/v-else 根據資料值來判斷是否輸出該dom元素，以及包含的子元素
yes
no #v-else 必須緊跟 v-if
v-show 根據條件展示元素的一種指令
show
hidden
if
show
v-if 引起了 dom 操作級別的變化，而 v-show 僅發生了樣式的變化，從切換的角度考慮，v-show 消耗的 效能要比 v-if 小。
3.列表渲染
v-for根據接收到陣列重複渲染 v-for 繫結到的 dom 元素及 內部的子元素，並且可以通過設定別名的方式，獲取陣列內資料渲染到節點中。
var vm = new vue(,
,
, ]
} });
} - } : }
var vm = new vue(
} });
}
there is first dom
there is second dom
there is third dom
}
}
vue 模板 計算 偵聽 條件渲染 列表渲染
通常是根據已有的 data 資料，計算生成新的資料，把這種結構叫做計算屬性，計算屬性在 vue 的選項物件中使用computed屬性來設定，例 注意，通常對於計算屬性，不會重新用 賦值。計算屬性與方法的區別 計算屬性的值會被快取，只有當其所依賴的資料發生變化後，才會重新計算計算屬性的值，計算完畢後繼...
列表渲染與條件渲染
作者 jeskson 達達前端小酒館 列表渲染與條件渲染 如何渲染陣列型別和物件型別的資料 渲染陣列 的所有資料 相同的結構是列表渲染的前提，列表等都會有 千上萬條的資料，它們的共同的特徵就是資料的結構相同。data 如何把整個列表都渲染出來呢？wx for 就是在陣列newstitle 進 迴圈 ...
1 4 Vue 條件渲染和列表渲染
1.條件渲染 v if v else if v else v show v if status 1 當status為1 顯示該行p v else if status 2 當status為2 顯示該行p v else status 3 當status為3 顯示該行p v show status 1 當...