Así que estoy creando una aplicación de prueba y el problema es que necesito resaltar el botón de respuesta marcada. Descubrí cómo hacerlo con Refs, pero funciona solo para tres preguntas. ¿Cómo lo cambio para que funcione durante toda la prueba? mapeo a través de respuestas de preguntas
<TouchableOpacity key={answers.buttonId} onPress={() => { checkIfCorrect(answers.isCorrect); resetColors(answers.buttonId); highlightBlack(answers.buttonId); }} style={{ borderWidth: 1, width: "80%", margin: "5%", }} > <View ref={(el) => (myRefs.current[answers.buttonId] = el)}> <Text style={{ color: "grey", fontSize: 32, textAlign: "center", }} > {answers.answerText} </Text> </View> </TouchableOpacity> ))}``` Array element with question ```{ questionNumber: 3, questionText: "Solve 1 - 5x = 0.", questionImage: "", answers: [ { answerText: "5", isCorrect: true }, { answerText: "-1/5", isCorrect: false }, { answerText: "1/5", isCorrect: true }, { answerText: "4", isCorrect: false }, ], },``` This how i use refs ``` const highlightBlack = (itemId) => { myRefs.current[itemId].setNativeProps({ style: { backgroundColor: "black" }, }); }; const resetColors = (itemId) => { myRefs.current.forEach((ref) => { if (ref !== itemId) { ref.setNativeProps({ style: { backgroundColor: "white" } }); } }); };``` It crashes after the 3rd question