首页 > 解决方案 > 如何在 React 状态数组中不包含重复值,如何防止数组中的值重复?

问题描述

我想在 items[0].question 状态中存储 15 个不同的问题

我想确保我不能将重复的值推送到 React 状态的数组中。不过,重复的值仍在数组中。

我试过使用 .includes 但它不起作用。

const [exam, setExam] = useState({
    subjectName: "",
    questions: [

    ], notes: [
        ""
    ]
})

const [item, setItem] = useState([
    {
        question: "",
        answer: "",
        options: []
    }
])

const nextQuestion = (e) => {
    e.preventDefault()
    const que = item[0].question

    exam?.questions?.push({ question: que, answer: value, options: [item[0].options[1], item[0].options[2], item[0].options[3], item[0].options[4]] })

}

标签: arraysreactjsduplicatesuse-statearrayofarrays

解决方案


因为您使用的是 setState,所以您需要使用setExam来更新exam

就像是:

const newQuestion = { question: que, answer: value, options: [item[0].options[1], item[0].options[2], item[0].options[3], item[0].options[4]] }
newExams = {...exam, questions: [...exam.questions, newQuestion ]}
setExam(newExams)

推荐阅读