实现 “先排除数组中对象的 showTiltle: true 字段，再判断两个数组的对象内容是否完全相同（不考虑顺序、只关注对象值和增删和值的变化）”

<template><div><button @click="checkArrays">判断两个数组是否相同</button><p>结果：{{ resultText }}</p></div>
</template><script>
export default {data() {return {// 原始数组tableProp: [{ type: 'selectionCheck', showTiltle: true, minWidth: 20 },{ label: '告警ID', prop: 'id', showTiltle: true, minWidth: 40 },{ label: '规则名称', prop: 'ruleName', showTiltle: true, minWidth: 45 },{ label: '监控模块', prop: 'alertModelName', showTiltle: true, minWidth: 46 },{ label: '监控项', prop: 'categoryName', slot: 'categoryName', showTiltle: true, minWidth: 50 },{ label: '详细信息', prop: 'description', showTiltle: true, minWidth: 80 },],// 新数组newTableProp: [{ type: 'selectionCheck', minWidth: 20, prop: 'ruleName' },{ label: '告警ID', prop: 'id', minWidth: 40 },{ label: '监控模块', prop: 'alertModelName', minWidth: 46 },{ label: '规则名称1', prop: 'ruleName', showTiltle: true, minWidth: 45 },{ label: '监控项', prop: 'categoryName', slot: 'categoryName', minWidth: 50 },{ label: '详细信息', prop: 'description', minWidth: 80 },],resultText: '' // 存储判断结果};},methods: {/*** 核心方法：判断两个数组对象内容是否完全相同（排除 showTiltle 字段，不考虑顺序）* @param {Array} arr1 - 第一个数组* @param {Array} arr2 - 第二个数组* @returns {Boolean} 是否相同*/isArraysEqual(arr1, arr2) {// 步骤1：移除数组中所有对象的 showTiltle 字段const removeShowTiltle = (arr) => {return arr.map(obj => {const newObj = { ...obj }; // 浅拷贝对象，避免修改原对象delete newObj.showTiltle; // 删除目标字段return newObj;});};// 步骤2：将对象标准化（按属性名排序，确保同内容对象字符串一致）const normalizeObject = (obj) => {const sortedKeys = Object.keys(obj).sort(); // 按属性名排序const sortedObj = {};sortedKeys.forEach(key => {sortedObj[key] = obj[key];});return JSON.stringify(sortedObj); // 转换为字符串};// 步骤3：标准化数组（移除字段 + 转换为排序后的字符串数组）const normalizeArray = (arr) => {const cleanedArr = removeShowTiltle(arr);return cleanedArr.map(normalizeObject).sort(); // 排序消除顺序影响};// 步骤4：对比标准化后的数组const normalizedArr1 = normalizeArray(arr1);const normalizedArr2 = normalizeArray(arr2);return JSON.stringify(normalizedArr1) === JSON.stringify(normalizedArr2);},// 调用方法并展示结果checkArrays() {const isSame = this.isArraysEqual(this.tableProp, this.newTableProp);this.resultText = isSame ? '两个数组内容完全相同' : '两个数组内容不同';}}
};
</script>

关键逻辑说明
移除 showTiltle 字段：通过 map 遍历数组，复制每个对象并删除 showTiltle 属性，确保后续对比不受该字段影响。
对象标准化：同一个对象若属性顺序不同（如 {a:1, b:2} 和 {b:2, a:1}），直接 JSON.stringify 会得到不同结果。因此先按属性名排序，再转换为字符串，保证同内容对象的字符串一致。
数组标准化：将处理后的对象数组转换为字符串数组，再排序，消除数组内部的顺序差异（例如 [obj1, obj2] 和 [obj2, obj1] 会被视为相同）。
最终对比：标准化后的数组已消除顺序、showTiltle 字段的影响，直接对比字符串即可判断内容是否完全相同。
结果分析
在你的示例中，两个数组处理后存在以下差异：
tableProp 中有 {label: ‘规则名称’, prop: ‘ruleName’, minWidth: 45}，而 newTableProp 中对应位置是 {label: ‘规则名称1’, prop: ‘ruleName’, minWidth: 45}（label 不同）。
newTableProp 中第一个对象多了 prop: ‘ruleName’，而 tableProp 中对应对象没有该属性。
因此，isSame 结果为 false，符合预期。

封装说明
核心方法 isArraysEqual：接收两个数组作为参数，内部包含三个子步骤：
removeShowTiltle：移除所有对象的 showTiltle 字段（避免该字段干扰对比）。
normalizeObject：将对象按属性名排序后转为字符串（解决 “属性顺序不同但内容相同” 的问题）。
normalizeArray：将数组处理为 “排序后的标准化字符串数组”（解决 “数组内对象顺序不同” 的问题）。
使用方式：在组件中直接调用 this.isArraysEqual(arr1, arr2) 即可判断两个数组是否相同，返回 true（相同）或 false（不同）。
优势：
不修改原数组（通过浅拷贝对象实现），避免副作用。
兼容对象属性顺序不同、数组内对象顺序不同的场景。
可直接复用在其他需要对比数组对象的场景中。
效果测试
点击按钮后，会触发 checkArrays 方法，根据示例中的数组内容，最终会显示 “两个数组内容不同”（因 label 和 prop 存在差异）。如果修改数组使内容完全一致（排除 showTiltle 后），则会显示 “两个数组内容完全相同”。