React communication problem from child to parent(反应孩子与父母的沟通问题)
本文介绍了反应孩子与父母的沟通问题的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在构建一个猜谜游戏,其中问题和选择逻辑位于名为 Questions 的组件中.我无法让 App 读取问题代码.我希望 App 中的状态根据子组件中的选择进行更新.
我一直在尝试从 如何在 ReactJS 中将数据从子组件传递到其父组件? 和 https://malithjayaweera.com/2018/01/reactjs-passing-data-react-components/,但我不清楚如何将它应用到我的项目中.
应用程序:
import React, { Component } from 'react';导入'./App.css';从./Timer"导入定时器;从./Questions/Questions.js"导入问题;从../src/Results"导入结果;类应用扩展组件{状态 = {总真:0,完全错误:0,}组件DidMount() {console.log(`TotalTrue: ${this.state.totalTrue}`);console.log(`TotalFalse: ${this.state.totalFalse}`);}//提交按钮处理表单提交 = 事件 =>{event.preventDefault();console.log("点击提交按钮");};callbackHandlerFunction = (selectedOption) =>{this.setState({ selectedOption });}使成为() {返回 (<div className="视差"><div className="App"><div className="包装器"><div className="headerDiv"><h1>皮克斯琐事!</h1></div><div className="timerDiv"><定时器/></div><div className="questionSection"><问题handleClickInParent={this.callbackHandlerFunction}/></div><button onClick={this.handleFormSubmit}>提交</button></div>{/* this.state.articles.length >0&&...*
织梦狗教程
本文标题为:反应孩子与父母的沟通问题
基础教程推荐
猜你喜欢
- Bootstrap 模态出现在背景下 2022-01-01
- 原生拖动事件后如何获取 mouseup 事件? 2022-01-01
- 检查 HTML5 拖放文件类型 2022-01-01
- fetch 是否支持原生多文件上传? 2022-01-01
- 在 contenteditable 中精确拖放 2022-01-01
- 如何添加到目前为止的天数? 2022-01-01
- Bokeh Div文本对齐 2022-01-01
- npm start 错误与 create-react-app 2022-01-01
- 即使用户允许,Gmail 也会隐藏外部电子邮件图片 2022-01-01
- Fabric JS绘制具有活动形状的多边形 2022-01-01
