如何解决通过单选按钮在React中添加状态的答案
我正在使用react和react-redux创建一个mcq测验应用程序。我已经动态创建了MCQ。我正在使用Firestore到后端。现在,我想单击“提交”按钮以添加状态的答案。这是下面的代码。我想将答案添加到answer []状态,然后将其发布到firestore。
class Exam extends Component {
state = {
id: null,answers: [],};
componentDidMount() {
let id = this.props.match.params.examId;
this.setState({
id: id,});
}
render() {
// console.log(this.props.questions);
const { auth,questions } = this.props;
console.log(this.props);
if (!auth.uid) {
return <Redirect to="/" />;
}
const questionComponent = questions ? (
questions.map((type) => {
const options = type.options.map((option,index) => {
return (
<Form.Check
key={index}
type="radio"
name={type.id}
label={option}
value={option}
id={index}
/>
);
});
return (
<div key={type.id} className="mb-3">
<Row>
Question#. {type.id}. {type.question}
</Row>
{options}
</div>
);
})
) : (
<div className="container">
<Spinner />
</div>
);
return (
<div className="container" style={{ width: "8 rem" }}>
<br />
<br />
<br />
{/* <h1>Exam id is {this.state.id}</h1> */}
<Form>
{questionComponent}
<Button variant="primary" type="submit">
Submit
</Button>
</Form>
</div>
);
}
}
const mapStateToProps = (state) => {
return {
auth: state.firebase.auth,questions: state.firestore.ordered.questions,};
};
export default compose(
connect(mapStateToProps),firestoreConnect((props) => [
{
collection: "questions",doc: props.match.params.examId,subcollections: [{ collection: props.match.params.examId }],storeAs: "questions",orderBy: "id",},])
)(Exam);
我该怎么做?
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。