vue+Element表單驗證之滾動條定位到校驗未通過的表單控件的位置

需求：提交表單時，頁面定位到第一個校驗失敗的位置

代碼示例：

 　 // 點擊提交按鈕
　　clickToAdd(state) {
　　　　// elementUI的form表單校驗：
　　　　this.$refs.form.validate((valid) => {
　　　　　　 if (valid) {
          　　this.$emit('clickToAdd', false, this.form, state)  // 如果校驗通過，在父組件調用接口
        　 } else {
          　　// 滾動條定位到第一個校驗失敗的div的位置
          　　this.needLocateToErr && this.locateToErr()
          　　return false
         }
      })
    }

關鍵：

    // 滾動條定位到第一個校驗失敗的div的位置
    locateToErr() {
      setTimeout(() => {
        const errorDiv = document.getElementsByClassName('is-error')
        errorDiv[0].scrollIntoView()
      }, 0)
    },

因為是在后期提出：需要定位到第一個校驗失敗的位置的需求，這時候已經有很多頁面了。一頁一頁去修改工程比較浩大，所以借用了elementUI校驗失敗的時候自帶的class：is-error；以求做出較小的修改完成需求；