vue2 对象数组清空和el-input清空

1. 对象数组清空：

如果是 Vue2 中的数据，我们可以通过以下两种方式来清空对象数组：

方式一：使用 splice() 方法

this.array.splice(0, this.array.length);

方式二：使用 Vue.set() 方法

this.$set(this, 'array', []);

其中，array 为需要清空的对象数组。

2. el-input 清空：

如果是 el-input 清空，我们可以通过以下两种方式来实现：

方式一：使用 v-model 双向绑定

在 el-input 中使用 v-model 绑定一个变量，在清空时直接将该变量赋为空即可。

<el-input v-model="value"></el-input>

this.value = '';

方式二：使用 ref 属性

在 el-input 中使用 ref 属性绑定一个变量，在清空时直接通过该变量的方法清空即可。

<el-input ref="input"></el-input>

this.$refs.input.clear();

其中，input 为 ref 属性绑定的变量名。

相关问题

vue实现el-input中验证输入的内容是否是json对象、array数组、json数组对象

要验证输入的内容是否是 JSON 对象、数组或 JSON 数组对象，你可以使用 Vue 的自定义指令或者计算属性来实现。下面是一个使用自定义指令的示例：

<template>
  <div>
    <el-input v-model="inputValue" v-json-validator></el-input>
  </div>
</template>

<script>
export default {
  data() {
    return {
      inputValue: ""
    };
  },
  directives: {
    jsonValidator: {
      bind(el, binding, vnode) {
        el.addEventListener("input", () => {
          const value = el.value;
          try {
            // 尝试解析输入的内容为 JSON
            const json = JSON.parse(value);
            if (Array.isArray(json)) {
              // 验证是否为数组
              vnode.context.inputValue = json;
            } else if (typeof json === "object" && json !== null) {
              // 验证是否为 JSON 对象
              vnode.context.inputValue = json;
            } else {
              // 内容不是 JSON 对象或数组，清空输入框
              vnode.context.inputValue = "";
            }
          } catch (error) {
            // 内容不是有效的 JSON，清空输入框
            vnode.context.inputValue = "";
          }
        });
      }
    }
  }
};
</script>

在上面的示例中，我们创建了一个 `v-json-validator` 自定义指令来监听输入框的内容变化。当输入框内容发生变化时，我们尝试将其解析为 JSON。如果解析成功并且是数组或对象类型，我们将其赋值给 `inputValue` 数据属性。如果解析失败或者不是数组或对象类型，则清空输入框。

请注意，这只是一个简单的示例，仅验证输入内容是否符合 JSON 对象、数组或 JSON 数组对象的基本格式要求。如果需要更复杂的验证逻辑，你可能需要增加更多的代码。

希望这能满足你的需求！如果还有其他问题，请随时提问。

VUE2 el-input 只能输入正整数

在Vue.js 2.x中，如果你想要限制`el-input`组件只能接受正整数输入，你可以通过自定义事件或者使用第三方插件来实现。这里我们可以创建一个简单的基于正则表达式的验证方法：

首先，你需要在`v-model`绑定的数据上添加一个验证函数，例如：

<template>
  <el-input v-model.number="inputValue" @input="validateInput"></el-input>
</template>

<script>
export default {
  data() {
    return {
      inputValue: '',
    };
  },
  methods: {
    validateInput(value) {
      // 正则表达式匹配正整数， /^\d+$/
      const regex = /^\d+$/;
      if (regex.test(value)) {
        this.inputValue = Number(value); // 如果是正整数，则更新值
      } else {
        // 如果不是正整数，可以阻止默认行为，比如清空输入或者显示错误提示
        event.preventDefault();
        this.inputValue = '';
      }
    },
  },
};
</script>

在这个例子中，当用户输入的内容不符合正整数规则时，会阻止输入并保持输入框为空。