javascript - 大规模创建一个简单的React多三元运算符以合并数组吗？

我正在寻找在React中创建一个简洁的多元操作，该操作根据存在的道具将数组与不同的组合合并在一起。

小规模的例子，我有：

array3应该始终输出。

如果存在array2，则只能将array3与array1（或this.props.data.array2）合并。

如果存在array1，则只能将array3与array2（或this.props.data.title1）合并。

{
  this.props.data.title3
    ? this.props.data.title2
      ? this.props.data.title1
        ? [...array1, ...array2, ...array3]
        : [...array2, ...array3]
      : [...array2, ...array3]
    : [...array3];
}

但是随着组合的增加，我将不得不产生更多次。

我可能有100种组合，并且我正在寻找一种简明扼要的编写方式，因此不必不必编写过多的三元运算符即可获得所需的输出。

任何帮助，将不胜感激！

最佳答案

您应该使用简单的if块，然后将合并所需的值添加到array3

this.props = {
  data: {
    title1: true,
    title2: false,
    title3: true
  }
}

let array3 = [3]
let array2 = [2]
let array1 = [1]

if(this.props.data.title2){
  array3 = [...array3,...array2]
}


if(this.props.data.title1){
  array3 = [...array3, ...array1]
}

console.log(array3)

注意：-如果要合并具有真实值的所有标题的数组，则可以简单地创建一个执行此合并部分并为标题调用的函数，而不是为每个标题重复if块