vue.js - 如何在功能组件中使用插件的指令 - Vue 2

Question

有一个插件：https ://vuejs-tips.github.io/vue-the-mask/

还有一个功能组件：

import { mask } from 'vue-the-mask'

const component = createElement('input', {
  directives: [
    name: 'v-mask'
  ]
})

如何将此掩码实际应用于我的功能组件？

标签： vue.js

Answer 1

如果您打算对指令进行硬编码：

const component = createElement('input', {
  directives: [
    name: 'mask',
    value: '##-##-##',
  ]
})

如果您只想通过组件传递它，例如<InputBox v-mask="'##-##-##'" />：

const component = createElement('input', {
  ...(data.directives?.length && {
    directives: [data.directives[0]],
  }),
})

它只接受一个指令，如果你想使用多个指令，那么你只需要遍历它们。