前端学习（2308）：react之子传父

Home,js

import React, {Component} from 'react';
import News from "./News";
class Home extends Component {constructor(props) {super(props);this.state={text:'我是默认值'}}dataFun=(text)=>{console.log(text)this.setState({text})}render() {return (<div>home---<p>{this.state.text}</p><News name="你好" fufun={this.dataFun}/></div>);}
}export default Home;

news,js

import React, {Component} from 'react';
import PropTypes from 'prop-types';class News extends Component {constructor(props) {super(props);this.state={num:1111,ziText:"我是子组件的值"}}fun(){this.setState({num:222})}render() {return (<div>News-----{this.props.name}-----{this.state.num}<button onClick={this.fun.bind(this)}>哈哈</button><button onClick={this.props.fufun.bind(this,this.state.ziText)}>发送</button></div>);}
}News.propTypes = {};export default News;

app.js

import React from 'react';import './App.css';
import  Home from './components/Home.js'
function App() {return (<div className="App">你好<Home></Home></div>);
}export default App;

前端学习（2308）：react之子传父相关推荐

react（子传父、父传子）
目录 1. 父传子数组/对象的两种写法 2. 子传父: 3. 生成唯一id的库: 4. 对接收的组件进行验证 1. 父传子数组/对象的两种写法 function App() {const ob ...
react 通信-子传父
父组件中定义一个回调函数,由子组件来调用执行.用this.props.[父组件自定义回调函数名称]()调用 /** @Author: Spring* @LastEditors: Aidam_Bo* @ ...
前端学习（2233）：react的子传父数据传递
import React from 'react'; import ReactDOM from 'react-dom';import './App.css' class ParentCom exten ...
React组件通信(父传子,子传父) - 前端
父组件向子组件传值(通过props传值) 子组件: class Children extends Component{constructor(props){super(props);}render() ...
React (三) 修改props，React父传子、子传父、this绑定
Props介绍与应用什么是 props 如何使用父传子函数组件类组件默认值子传父修改 props 事件监听 this 绑定直接在 jsx 元素上进行绑定(不推荐) 箭头函数(推荐) 直 ...
React父传子、子传父
父子传值父传子将子组件导入父组件并使用,在注册的子组件标签上通过自定义属性接收要传递的变量或者方法,在父组件的constructor(props)可以通过props属性接收父组件传递过来的方法 / ...
react 三种通信方式（父传子、子传父、兄弟传值）
react有三种通信方式:一.父传子,二.字传父,三.兄弟之间传值一.父组件向子组件传值父组件通过属性的方式传递参数,子组件通过props来接收父组件传递过来的参数 React中是单向数据流,数据 ...
【vue3.0学习】父传子子传父
父传子 <template><div id="app"><h1>父组件</h1><p>{{ money }}</p ...
Vue组件之间的通讯方式——父传子、子传父、兄弟组件间的通讯
目录一.父传子 1.props 属性传递 2.方法传递 3. $parent获取方法和属性二.子传父 1. 属性传递 2 .通过$refs主动获取子组件方法和属性 3 .通过$children主动 ...

前端学习（2308）：react之子传父

前端学习（2308）：react之子传父相关推荐

最新文章

热门文章