vue中正则验证数组长度

你可以使用 Vue 中的自定义指令来实现对数组长度的正则验证。下面是一个简单的例子：

Vue.directive('array-length', {
  bind: function (el, binding) {
    el.addEventListener('input', function () {
      const regex = binding.value.regex;
      const maxLength = binding.value.maxLength;
      const value = el.value;

      if (Array.isArray(value) && value.length > maxLength) {
        el.setCustomValidity(`数组长度不能超过 ${maxLength}`);
        return;
      }

      if (!regex.test(value)) {
        el.setCustomValidity('格式不正确');
        return;
      }

      el.setCustomValidity('');
    });
  }
})

然后在你的模板中，你可以使用这个指令来验证你的数组：

<template>
  <input type="text" v-model="myArray" v-array-length="{ regex: /your-regex-here/, maxLength: 5 }">
</template>

这个例子中，我们定义了一个 `v-array-length` 指令，它接受一个包含正则表达式和最大长度的对象作为参数。当输入框的值改变时，我们使用这些参数来验证数组的长度和格式。如果验证失败，我们使用 `setCustomValidity` 方法来设置输入框的自定义验证错误信息。