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')
    )
  • 相关阅读:
    ffmpeg 日志系统av_log()
    语音识别哪家强 讯飞 搜狗 百度 阿里还是腾讯
    利用FFmpeg切割视频
    网易云音乐 抓取成功,按评论数排序
    python from import 自定义模块
    使用Fiddler调试线上JS代码
    sublime text 格式化html css 与显示函数列表
    微信硬件(四)调试工具
    微信硬件平台(三) 菜单开发
    微信硬件(三)
  • 原文地址:https://www.cnblogs.com/xu3241/p/13823119.html
Copyright © 2011-2022 走看看