将 Vue 指令置于条件

Question

我想提出一个指令在Vue公司组件上的条件。我已经安装了一个名为“掩码”的包，我想将v-mask 指令置于条件......在某些情况下，组件没有名为“掩码”的属性，但在某些情况下有。所以当我没有将掩码传递给我的组件时出现此错误，这是我在其中使用 v-mask 指令的组件：

<input v-mask="mask" />

有什么方法可以插入 v-mask 如果 mask 属性通过，而如果 mask 为空则不插入？？？？

Answer 1

<input v-mask="mask" v-if="mask.length">
<input v-else>

Answer 2

您可以在绑定指令之前检查条件。

考虑您的用例：

<input v-mask="mask" />

您的指令如下所示：

import { mask } from 'v-mask'

directives: {
    mask: {
      bind(el, binding, vnode, oldVnode) {

        // This is the condition
        if (binding.value) {
          mask(el, binding, vnode, oldVnode)
        }

      }
    },
},

bind() 方法中的条件检查传递给指令的值是否存在，是否为真。

如果它是真的，它会继续执行实际的指令。