前端兩三問(20190923)

一、js如何獲取數組的key

function getObjectKeys(object){
    var keys = [];
    for (var property in object)
    return property;
}

console.log(getObjectKeys(3332:[]))     // 3332

二、如何過濾數組中的空數據

Array.prototype.notempty = function() {
  var arr = [];
  this.map(function(val, index) {
    if (val !== "" && val != undefined) {
      arr.push(val);
    }
  });
  return arr;
}
this.selectHouse = this.selectHouse.notempty()

三、iview checkboxGroup 動態刪除某個值後，頁面checkBox 選中狀態錯亂。

具體狀況以下：

需求 ：

checkboxGroup v-for生成三個checkbox，默認勾選。當我點擊某個checkbox默認取消勾選而且刪除該checkbox。

操做方法一：

從最後一個開始刪，也就是刪除默認綁定的model數組中的最後一個值，這時候剩餘checkbox的選中狀態是正常的。

操做方法二：

可是若是從中間開始刪，好比刪除第二，那麼第二個checkbox會被刪除，可是第三個checkbox的選中狀態樣式沒有了，model數據仍是在的。

解決方法一：

咱們在刪除 model數據後，更新數據的時候用this.$nextTick進行數據更新

解決辦法二：

v-for 的時候key的取值不取 index 而取實際的value值

延伸：

v-for在更新已渲染的元素列表的時候，採用 就地複用 策略，若是列表的數據發生變化，那麼它會根據key值取判斷值是否修改，若是修改則從新渲染這一項，不然則複用以前的數據。可是若是咱們用 index 下標來做爲 key，那麼在上面的例子中，咱們刪除了第二個數據，數據由三條變成了兩條，列表從新渲染，而本來第三個checkbox的key是2，因爲model 數據長度由3變成了2。第三個checkbox的key由 2 變成了1 致使從新賦值渲染。因此就致使實際值存在，但選中狀態缺消失了的問題。

關注公衆號 【小夭同窗】

關注公衆號 【小夭同窗】