在反應中保持先前狀態

Question

我有2個對象數組，它們相互依賴。

const types = [{
  id:1,
  name: 'male'
},{
  id:2,
  name: 'female'
}]

const voices = [{
  value: 20
},{
  value: 40
},{
  value: 60
},{
  value: 80
},{
  value: 100
}]

聲音取決於類型。 我想控制一種狀態，如果用戶選擇了男性類型，則會向用戶顯示一個新列表，用戶可以選中該復選框。 用戶單擊其他類型（例如，女性）后，將顯示帶有未選中復選框的新類型列表。 挑戰在於，當用戶單擊回到男性時，如何保持先前選擇的類型（例如，男性）的狀態，以便其持續存在？

演示https://codesandbox.io/s/4w07v2opn9

Answer 1

分別保留男聲和女聲，並根據選定的類型值決定在handleChange中設置哪些聲音