最近在寫一個vue的項(xiàng)目，然后用到了自定義指令，但是在使用的時候**，數(shù)據(jù)沒有及時更新到視圖上去。**
首先我們得新建 一個js,然后在main,js里面引入，我的項(xiàng)目里面寫的名字是

keyInput.js

然后我在main.js里面引入了

import "@/keyInput.js";

接下來就是書寫符合自己要求的js

import Vue from 'vue'

Vue.directive('keyallow', {
    bind (el, binding) {
        el.onkeyup = (el) => {
            let bindType = binding.value.type;
            if (bindType == "Number") {
                el.value = el.value.match(/^[0-9]*/);
            }
            if (bindType == "word") {
                el.value = el.value.match(/^[0-9a-zA-Z-]*/);
            }
       		bing.value.set[binding.value.name] = el.value;**//將修改的數(shù)據(jù)渲染到頁面上**
        }
  },
})

關(guān)鍵就是

	bing.value.set[binding.value.name] = el.value;

準(zhǔn)備工作做完了，就是頁面上如何使用了

  <input type="text" maxlength="5" autocomplete="off"  class="inpt_t form-ctrl font30" style="text-align: right" name="Lcgh"   v-model="Lcgh" placeholder="請輸入攬存工號" required   v-keyallow="{ set: this, name: 'Lcgh',type:'Lcgh' }"/></span>

重點(diǎn)，我截圖了

紅色標(biāo)記的時候，需要保持一致，ok了