Skip to content

useArrayDifference

Reactive 获取两个数组的数组差异。

¥Reactive get array difference of two arrays.

默认情况下,它返回第一个数组与第二个数组的差值,因此在 A 中调用 B 的 A \ B,相对补集

¥By default, it returns the difference of the first array from the second array, so call A \ B, Relative Complement of B in A.

你可以传递 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 }]