使用面罩Vue 3

Question

我有个电话面具。更准确地说，是错误而不是掩码。我真的搞不懂为什么会发生这个错误，因为它完全没有信息！

​

​

<template>
  <input type="text" v-model="value" v-mask="'#-#-#'" />
</template>

<script>
import { ref, defineComponent } from "vue";

export default defineComponent({
  setup() {
    const value = ref("");

    return { value };
  },
  watch: {
    value(n) {
      this.$emit("input", n);
    },
  },
});
</script>

https://codesandbox.io/s/musing-resonance-dyl63c?file=/src/App.vue

如果您删除了v-mask指令，那么一切都按其应有的方式工作。我如何解决这个错误？？

谢谢!

Answer 1

试着在本地注册，它应该有效：

<template>
  <input type="text" v-model="value" v-maska="'#-#-#'" />
</template>

<script>
import { ref, defineComponent } from "vue";
import { maska } from "maska";
export default defineComponent({
  setup() {
    const value = ref("");

    return { value };
  },
  directives: { maska },
  watch: {
    value(n) {
      this.$emit("input", n);
    },
  },
});
</script>

Answer 2

试着这样做：

• 在你的main.js中，app.directive("v-mask", maska)和app.use(maska)一起去
• 在phone.vue中，v-mask="'#-#-#'"与v-maska="'#-#-#'"一起使用

码箱