如何检查新的输入行是不是与前一行（数组）冗余

Posted 2023-02-22

【中文标题】如何检查新的输入行是不是与前一行（数组）冗余

【英文标题】：How to check if a new row of inputs is redundant with previous rows (array)如何检查新的输入行是否与前一行（数组）冗余

【发布时间】：2021-11-03 23:06:22

【问题描述】：

我有一个由输入字段数组组成的表单。

有什么方法可以验证每一行中的输入 并检查它们是否在任何一个字段中至少有一个唯一值，这样就不会有相同的值了行？

例如，第 2 行最多只能有 4 个字段中的 3 个字段的值与第 1 行相似。

<form>
     <div>
        <table>
            <tr v-for="(item, i) of items" :key="i">
                <td>
                    <input type="date" :id="'date-' + i">
                </td>
                <td>
                    <input type="text" :id="'project_id-' + i">
                </td>
                <td>
                    <input type="text" :id="'hours-' + i">
                </td>
                <td>
                    <input type="text" :id="'description-' + i">
                </td>
            </tr>
            <tr>
                <td>
                    <button type="button" @click="itemCount++">Add Row</button>
                </td>
            </tr>
        </table>
    </div>
    <div>
        <button type="button" v-on:click="submit()">
    </div>
</form>

我遇到了一种使用distinctvalidation 的技术，但除了正确的语法和流程之外，不确定它的实用性。

【问题讨论】：

如果你能解释一下我想我们可以帮助你

@NipunTharuksha，实际上我想在表单提交之前逐行检查用户的输入，是否有两行或多行是多余的（不应该允许用户键入相同的每行中每个字段的值）。

所以你只会将不同的 id 从前端传递到后端

您可以在通过 SUBMITTED() 方法传入后端之前验证您的数据

在提交函数时循环每个 id 并将其推送到数组中。在推送检查之前数组是否包含相同的值。只是一个例子，有很多方法可以实现这一目标

【参考方案1】：

在submit() 函数中，将items 数组转换为Set 以删除冗余值。接下来，再次重新转换为Array，以便能够通过length 比较两个数组。如果长度不同，则表示存在冗余值。

submit() 
    const arr = this.items        
    var obj = arr.map(JSON.stringify)      
    var set = new Set(obj)
    var unique = Array.from(set).map(JSON.parse)              
    console.log(obj, set, unique);

    if(obj.length != unique.length) 
        alert("Error: Redundant inputs!")
     else 
        // submit the form
    ;

步骤：

首先，使用JSON.stringify方法将arr数组的每个对象转换成JSON编码的字符串。

其次，使用 map() 方法将 JSON 编码的字符串映射到新数组 obj。

第三，通过将obj 数组传递给新的集合构造函数来创建一个新的set，以删除所有重复的元素。

这个set 将只保存数组中唯一的值。

然后，通过传递set 作为参数，使用from() 方法将该集合转换为另一个数组unique。

这个新数组不会有前一个数组中的任何冗余对象（如果有的话）。

最后，通过length 比较两个数组，看看它们是否相等。长度不等表示存在冗余输入值。