1.html中多次使用V-if vi-else-if..來判斷組件dom是否創(chuàng)建晰绎，優(yōu)化使用<template v-if-"condition">dom.../template>包裹。原因:使用template條件渲
染固以，在Vue渲染時(shí)，生成vm對(duì)象時(shí)夭委，
template作為虛擬容器不會(huì)熏染到dom中肉康，當(dāng)條件變化時(shí)，它內(nèi)部的元素會(huì)根據(jù)條件動(dòng)態(tài)創(chuàng)建或者銷毀睹欲，惰性渲染的方式減少了不必要的dom操作菩浙，對(duì)于不
平凡切換的條件判斷，性能上會(huì)有一定優(yōu)化句伶。
優(yōu)化前
<div v-if-"condition">dom... </div>
<div v-else-if="condition">dom...=/divs
<div v-if-"condition">dom...</div>
優(yōu)化后
<template v-if-"condition">dom...</template>
<template v-else-if-"condition">dom...</template>
<template v-if-"condition">dom...-/template?
2.html中在多個(gè)V-if,vi-else-if中使用相同的參數(shù)作為判斷條件劲蜻，優(yōu)化使用computed計(jì)算屬性返回值作為判斷條件。computed計(jì)算屬性考余，具有自動(dòng)緩存計(jì)算
結(jié)果先嬉，在以來的數(shù)據(jù)沒有發(fā)生變化，
會(huì)返回上-次計(jì)算結(jié)果楚堤。響應(yīng)式更新疫蔓，在依賴的數(shù)據(jù)變化才會(huì)計(jì)算新值含懊，多個(gè)判斷邏輯集中管理代碼易于理解，computedi計(jì)算可以避免在vue模板編寫復(fù)雜的
判斷邏輯衅胀，在Vm對(duì)象里判斷條件跟簡(jiǎn)潔岔乔，性能上會(huì)有一定優(yōu)化。
優(yōu)化前
v-else-if-"row[item.prop] && item.prop---readDocumentStateName"
v-else-if="row[item.prop] && item.prop - label"
優(yōu)化后
v-else-if-"showTableColumn(row,item.prop,'readDocumentStateName')"
v-else-if-"showTableColumn(row,item.prop,'label')"
computed:{
showTableColumn0 {
return (row, showType, type) ->{
return row[showType] && showType---type
3.html中table表格渲染滚躯，列表在多次分頁數(shù)據(jù)時(shí)雏门，頁面渲染list過多會(huì)造成瀏覽器性能下降，用戶體驗(yàn)上卡頓和loading時(shí)間過長(zhǎng)掸掏∽掠埃可以在el-table外面包裹
<VirtualScroll :data-"tableData" :virtualized-"tableData.length>20" key-prop-"row" throttle-time-"1' @change-'res =>(VirtualTableData -
res)"
@selection-change="selectionChange//如果有select-Column
<el-table :data-"VirtualTableData"
<virtual-column key="row+'selection"/>
</el-table>
</NirtualScroll>
import VirtualScroll from 'el-table-virtual-scroll'
import ( VirtualColumn ) from 'el-table-virtual-scroll
components:{
VirtualScroll,
VirtualColumn
