相信已经接触react的同学们，对父子间传值已经不陌生了，但是相对来说，父组件向子组件传值很简单，直接在 子组件的标签上传过去，再从子组件的props上结构出来就ok了，但是很多同学还是理解不了如何由子组件向父组件传值，我之前学的都是类组件，后来公司是全面拥抱hooks的，所以，今天我把这两种方法都分享给大家
1，类组件
import React, { Component } from "react"; //定义父组件 export default class Parent extends Component { constructor(props) { super(props); this.state = { name: "this is parent", msg: "我是帅哥" }; } //定义一个方法 changeMsg = (x) => { this.setState({ msg: x }); }; render() { return (
{this.state.name}
{this.state.msg}
{this.state.name}
{this.state.msg}
); } } 按钮点击前后对比
2，hooks
import React, { useState } from "react"; //定义父组件 const App = () => { const [sex, setSex] = useState('男') return ( <> {sex}
Childer
); }; export default App; 其实通过对比大家就能够看出来，在state值较少的时候，函数式组件要比类组件轻量很多，也更容易阅读理解，好了，今天就分享这些，希望能够帮助大家，提前祝大家新年快乐呦！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请联系我们举报，一经查实，本站将立刻删除。
发布者：全栈程序员-站长，转载请注明出处：https://javaforall.net/221247.html原文链接：https://javaforall.net
