主题
useArrayDifference
Reactive 获取两个数组的数组差异。
🌐 Reactive get array difference of two arrays.
默认情况下,它返回第一个数组与第二个数组的差异,因此称 A \ B 为 A 中 B 的相对补集。
你可以传递 symmetric 选项来获取两个数组 A △ B 的对称差。
🌐 You can pass the symmetric option to get the Symmetric difference of two arrays A △ B.
用法
🌐 Usage
与反应式数组一起使用
🌐 Use with reactive array
ts
import { useArrayDifference } from '@vueuse/core'
const list1 = ref([0, 1, 2, 3, 4, 5])
const list2 = ref([4, 5, 6])
const result = useArrayDifference(list1, list2)
// result.value: [0, 1, 2, 3]
list2.value = [0, 1, 2]
// result.value: [3, 4, 5]与反应式数组一起使用并使用函数比较
🌐 Use with reactive array and use function comparison
ts
import { useArrayDifference } from '@vueuse/core'
const list1 = ref([{ id: 1 }, { id: 2 }, { id: 3 }, { id: 4 }, { id: 5 }])
const list2 = ref([{ id: 4 }, { id: 5 }, { id: 6 }])
const result = useArrayDifference(list1, list2, (value, othVal) => value.id === othVal.id)
// result.value: [{ id: 1 }, { id: 2 }, { id: 3 }]对称差异
🌐 Symmetric Difference
这个可组合组件还支持通过传递 symmetric 选项来实现对称差。
🌐 This composable also supports Symmetric difference by passing the symmetric option.
ts
import { useArrayDifference } from '@vueuse/core'
const list1 = ref([{ id: 1 }, { id: 2 }, { id: 3 }, { id: 4 }, { id: 5 }])
const list2 = ref([{ id: 4 }, { id: 5 }, { id: 6 }])
const result = useArrayDifference(
list1,
list2,
(value, othVal) => value.id === othVal.id,
{ symmetric: true }
)
// result.value: [{ id: 1 }, { id: 2 }, { id: 3 }, { id: 6 }]