• 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')
    )
  • 相关阅读:
    [新功能]在管理页面查看自己发表过的评论
    [致歉]中午机房电源故障
    [公告]发表文章功能小改动
    我的模块加载系统 v9(附例子下载)
    使用requestAnimationFrame更好的实现javascript动画(转)
    判定是否使用输入法
    mass Framework lang模块 v2
    mass Framework event模块
    mass Framework css模块
    requestAnimationFrame 动画接口
  • 原文地址:https://www.cnblogs.com/xu3241/p/13823119.html
Copyright © 2020-2023  润新知