vue和iview應用中的一些問題（持續更新）

以前回答過關於vue和iview使用的一些問題，偶爾又會有人再次問到，在以前的回答中去找太麻煩。
因而之後相關問題就概括在這裏啦。

一、 使用渲染函數渲染iview組件，如select時，添加on-change無效。
由於select中事件不是change，是on-change，因此應該是以下:

return createElement(
      'Select',
      {
         on: {
             on-change: () => {   //這裏的key是on-change,不是change
             
             }
         }
      }

二、在表單中使用iview Select或者其餘的value類型爲number時，校驗是否爲空。明明有值，確沒法校驗經過。

這是由於iview使用async-validator: https://github.com/yiminghe/a...。

默認校驗數據類型爲string，然而select的value爲number。因此應該修改rules

ruleValidate:{
        building: [
            { type: 'number', required: true, message: '必須選擇樓宇', trigger: 'change' }
        ]
  }

三、 在modal中使用form，添加了表單校驗，然而還想要有button的loading。loading默認設爲false，那麼不校驗了，默認爲true時，校驗不經過會有loading效果，那麼校驗不經過時設置loading爲false呢。那麼下一次編輯不校驗了。。。咱們經過以下的代碼，設置每次校驗完成從新設置loading爲true解決（有點繞，遇到問題的時候，自會明白）

this.$nextTick(() => {
        this.loading = true;
    });

四、父組件傳遞props給子組件，props爲array或object引用類型時，改變此引用類型，子組件不更新。

這個和vue的響應式有關，咱們正確的作法是調用vue示例的set方法，以下所示:

Vue.set(vm.someObject, 'b', 2)


this.$set(this.someObject,'b',2)   //全局Vue.set方法的別名

五、A頁面滾動到底部，路由從A頁面跳轉到B頁面，B頁面默認不在頂部，即滾動條沒有置頂。
採用vue-router中的scrollBehavior

//第三個參數 savedPosition 當且僅當 popstate 導航 (經過瀏覽器的 前進/後退 按鈕觸發) 時纔可用。
const router = new VueRouter({
  routes: [...],
  scrollBehavior (to, from, savedPosition) {
    if (savedPosition) {
      return savedPosition
    } else {
      return { x: 0, y: 0 }
    }
  }
})

六、vue中高亮搜索關鍵字

highlightSearchKeyword(val, keyword) {
   if (val.indexOf(keyword) > -1 && keyword !== '') {
      let reg = new RegExp(keyword , 'g');
      return val.replace(reg, '<span style="color: #ff4040">' + keyword + '</span>');
   } else {
      return val;
   }
}