为了账号安全,请及时绑定邮箱和手机立即绑定

TypeError:无法读取未定义的属性“地图”错误

TypeError:无法读取未定义的属性“地图”错误

动漫人物 2022-10-21 14:47:09
我想制作一个测验网络应用程序,每当我在其中添加地图功能时QuestionBox.js都会出错。有没有人有这个问题的解决方案?错误 :   4 | const [answer, setAnswer] = useState(options);   5 | return (   6 |   <div className="questionBox">>  7 |     <div className="question">{question}</div>     | ^   8 |     {answer.map((text, index) => (   9 |       <button  10 |         key={index}代码QuestionBox.js:import React, {useState} from "react";const QuestionBox = ({question, options, selected}) => {  const [answer, setAnswer] = useState(options);  return (    <div className="questionBox">      <div className="question">{question}</div>      {answer.map((text, index) => (        <button          key={index}          className="answerBtn"          onClick={() => {            setAnswer([text]);            selected(text);          }}        >          {text}        </button>      ))}    </div>  );};export default QuestionBox;
查看完整描述

3 回答

?
郎朗坤

TA贡献1921条经验 获得超9个赞

{this.state.questionBank.length > 0 && this.state.questionBank.map( ({question,answer,correct,questionId}) => ( ) ) } –

这里的答案应该是 QuizService 中定义的答案

这是正确的 QuestionBox 道具

{this.state.questionBank.length > 0 && this.state.questionBank.map( ({question,answers,correct,questionId}) => ( ) ) } –


查看完整回答
反对 回复 2022-10-21
?
红糖糍粑

TA贡献1815条经验 获得超6个赞

我收到此错误是因为在渲染options时未定义。QuestionBox你应该试试这个:


import React, {useState} from "react";


const QuestionBox = ({question, options = [], selected}) => {

  const [answer, setAnswer] = useState(options);

  return (

    <div className="questionBox">

      <div className="question">{question}</div>

      {answer && answer.map((text, index) => (

        <button

          key={index}

          className="answerBtn"

          onClick={() => {

            setAnswer([text]);

            selected(text);

          }}

        >

          {text}

        </button>

      ))}

    </div>

  );

};


export default QuestionBox;


查看完整回答
反对 回复 2022-10-21
?
慕容3067478

TA贡献1773条经验 获得超3个赞

将默认空数组分配给question参数。它将第一次解决可能未定义的问题。



查看完整回答
反对 回复 2022-10-21
  • 3 回答
  • 0 关注
  • 86 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信