自定义指令在 el-input 节点上无效解决方案

    Vue.directive('money', {
        // 初始化设置
        bind: function (el, binding, vnode, oldVnode) {
            el.value = XEUtils.commafy(el.value, { digits: binding.arg })
            el.onblur = () => {
                el.value = XEUtils.commafy(el.value, { digits: binding.arg })
            }
        }
    })Copy

<div class="el-input">
    <input type="text" autocomplete="off" placeholder="请输入内容" class="el-input__inner">
</div>Copy

   <div id="app">
        <h1>{{ money }}</h1>
        <p>v-money:2 vue指令可见值：<input v-model=" money" v-money:2></p>
        <p>thds(1)千分位过滤器: {{ money | thds(1) }}</p>
        <el-input v-model="money" placeholder="请输入内容" autosize v-money:2></el-input>
    </div>Copy

   Vue.directive('money', {
        inserted: function (el, binding) {
            // 指令作用在 element-input 节点，对应原生 div.el-input (真实input节点的父节点)
            if (el.tagName.toLocaleUpperCase() !== 'INPUT') {
                el = el.getElementsByTagName('input')[0]
            }
            el.value = XEUtils.commafy(el.value, { digits: binding.arg })
            el.onblur = () => {
                el.value = XEUtils.commafy(el.value, { digits: binding.arg })
            }
        }
    })Copy

    // 过滤器参数 通常与格式化，与值相关
    Vue.filter('thds', function (value, digits) {
        if (!value) return ''
        return XEUtils.commafy(value, { digits })
    })
Copy

    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <!-- 引入组件库 -->
    <script src="https://unpkg.com/vue/dist/vue.js"></script>
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/xe-utils"></script>Copy