zoukankan      html  css  js  c++  java
  • react 之props传值

    props 可以把数据从父传给子,如果想要实现子传给父数据,可以把数据当成函数的参数传递给父组件,下面给一行代码揣摩:

    class ParentCom extends React.Component{
        constructor(props){
            super(props)
            this.state = {
                childData:null
            }
        }
        render(){
            return (
                <div>
                    <h1>子元素传递过来的数据:{this.state.childData}</h1>
                    <ChildCom setChildData={this.setChildData}/>
                </div>
            )
        }
        setChildData = (data) => {
            this.setState({
                childData:data
            })
        }
    }

    class ChildCom extends React.Component{
        constructor(props){
            super(props)
            this.state = {
                msg: "helloworld"
            }
        }
        render(){
            return (
                <div>
                    <button onClick={this.sendData}>传递helloword给父元素</button>
                </div>
            )
        }
        sendData = () => {
            this.props.setChildData(this.state.msg)
        }
    }

    ReactDOM.render(
        <ParentCom/>,
        document.getElementById('root')
    )
  • 相关阅读:
    VSCode settings.json的配置样例
    用css让div高度自动撑满屏幕
    C# 后端接受前端上传的文件
    netcode 控制台项目生成exe文件
    C# UDP发送和接收
    C# 直播录制视频
    Vs2017 FrameWork EF Mysql Mvc 三层整合1
    Vs2017 FrameWork EF Mysql 控制台应用
    Vs2017 NetCode EF Mysql 控制台应用
    Vs2017 NetCode Mvc EF Mysql 整合2
  • 原文地址:https://www.cnblogs.com/xu3241/p/13823119.html
Copyright © 2011-2022 走看看