為什麼要吐槽iview的table元件呢？
首先iview的table的使用體驗十分的不友好，每次修改資料都會重刷整個**，效能極差，因為重刷**會導致自動失焦等問題！
vue不是有diff演算法嗎？重刷**資料沒有發生變化部分是不會重新渲染的，效能為什麼會差呢？
是的，diff演算法是可以優化vnode的渲染問題，但是前提是key,tag等屬性沒有發生變化的情況，可是萬惡的iview table既然私自修改了key的值，導致diff的優化失效。
如何解決這個問題？
table元件data屬性接收的資料來源與實際操作的資料分離，例如：以下例子的tempdata與data。
export default
/>;
} },
],data:
},watch:,
}}
table元件的內容主題table-body元件，table-body的data屬性接收的是rebilddata
<div
:class
="[prefixcls + '-body']"
:style
="bodystyle"
ref="body"
@scroll
="handlebodyscroll"
v-show
="!((!!localenodatatext && (!data || data.length === 0)) || (!!localenofiltereddatatext && (!rebuilddata || rebuilddata.length === 0)))"
>
<
table-body
ref="tbody"
:prefix-cls
="prefixcls"
:styleobject
="tablestyle"
:columns
="clonecolumns"
:data
="rebuilddata"
:columns-width
="columnswidth"
:obj-data
="objdata"
>
table-body
>
div>
table元件內部實現深度監聽了data屬性，當data的任意屬性發生變化就會重新生成rebuilddata。（深度拷貝乙份原有的data）為什麼要拷貝乙份呢？
解：為了防止table元件內部直接通過params.row直接修改資料來源，直接修改資料來源容易導致bug難追溯，資料容易錯亂等情況，增加維護成本！
watch://here will trigger before clickcurrentrow, so use async
settimeout(() =>, 0);
},deep:
true
}, .....
}
生成新的data資料，並重置每一項資料的_rowkey屬性(該屬性被table-tr元件當作key來使用)，_rowkey是全域性遞增的，每一次table重新render,_rowkey都會不斷遞增，導致diff演算法失效（導致**重新渲染的元凶）
makedatawithsortandfilter () ,makedatawithsort ()
}if (sorttype !
== 'normal' && !iscustom) data
= this.sortdata(data,
sorttype, sortindex);
return data;
},// 生成新的data
makedata () );
return data;
},
獲取iview中表單元件Table的選中資料
背景 在做某系統的審批中心時，新增了審批訊息一鍵已讀和刪除功能，用iview的表單元件 table實現訊息列表展示，效果如下圖所示 在實現一鍵已讀或一鍵刪除時需要獲取當前訊息列表中所有選中項，通過與服務端api互動來改變訊息狀態或刪除訊息。iview官方文件僅提供單選 全選或者選中項發生變化時的監聽...
吐槽大會4 《吐槽大會4》是《吐槽大會》的終點嗎？
1月18日，吐槽大會4 最新一期如約開播。導演徐崢作為 主咖 帶著自己即將於大年初一上映的電影 囧媽 參加節目。節目播出之後，徐崢吐槽郭京飛 李誕讚吐槽大會沒有下一季 李庚希跟徐崢要易烊千璽演唱會門票 等話題接連登上微博熱搜榜，而在這之中最為觀眾注意的則是思文不僅喊話 囧系列 不要繼續了，同時也調侃...
iView修改Table元件中標題和內容的樣式
iview是乙個封裝的比較好的vue元件，所以當我們需要去修改其中部分元件的樣式時，就沒有修改普通css那麼容易了，但我們還是有方法去修改的，下面列出一種解決修改樣式問題的方案，親測有效。對於樣式的修改我們要用到的是table元件api中的兩個重要函式 render，renderheader，具體這...