關於element-ui select組件change事件只要數據變化就會觸發的解決辦法

對象賦值問題(對象賦值影響原對象)

問題示例
直接用=的方式把一個對象賦值給另一個對象，會導致修改新對象時，原對象也發生變化

var obj1 = {'age': '10','friends':{'Aymi':'12','Jack':'9'}};
var obj2 = obj1; // obj1賦值給新對象obj2
obj2.age = '20'; // 修改obj2的age值
console.log(obj1.age); // '20' // obj1中的age值也改變了

問題原因：
JavaScript 中對象的賦值是默認引用賦值的（兩個對象指向相同的內存地址），所以修改另一個對象時，即修改了內存地址里的對象，其他關聯對象也會改變。

解決方法：

• 轉換類型法：obj2=JSON.parse(JSON.stringify(obj1))
• es6之Object.assign()法：obj2=Object.assign({},obj1)

注：Object.assign()方法有不足之處，Object.assign()只是讓對象里第一層的數據沒有了關聯性(即修改obj2.age時obj1.age不會發生變化)，但是對象內的對象則跟被復制的對象有着關聯性的(即當修改更深層的obj2.friends.Aymi的值時，原對象obj1.friends.Aymi也跟着發生了變化)

所以推薦使用obj2=JSON.parse(JSON.stringify(obj1))這種方法

visible-change使用

使用select組件和表格組件結合起來用，但是發現在點擊下一頁的時候，由於select當中的數據發生了變化，所以也會觸發select當中的change事件，但是我只希望在我主動改變select組件當中的數據的時候才觸發change事件要怎么辦呢？

去看element-ui的官方文檔后發現select組件當中還有個visible-change事件，在visible-change事件當中添加個數據起到開關的作用，只有在點擊下拉的時候‘開關’才打開。 才能執行change事件。當點擊下一頁的時候將開關關閉。

visible-change 下拉框出現/隱藏時觸發 出現則為 true，隱藏則為 false