React学习11----父组件给子组件传值时defaultProps和propTypes使用

最新推荐文章于 2024-01-02 15:35:39 发布

zhaihaohao1

最新推荐文章于 2024-01-02 15:35:39 发布

阅读量867

点赞数 1

分类专栏： React

本文链接：https://blog.csdn.net/zhaihaohao1/article/details/87889421

版权

都是定义在子组件里面
defaultProps:父子组件传值中，如果父组件调用子组件的时候不给子组件传值，可以在子组件中使用defaultProps定义的默认值

propTypes：验证父组件传值的类型合法性

        1、引入import PropTypes from 'prop-types';

        2、类.propTypes = {
            name: PropTypes.string
        };

参考：
https://reactjs.org/docs/typechecking-with-proptypes.html

例子：项目结构：
在这里插入图片描述

父组件:Father.js

import React from 'react';
import Son from "./Son";

/**
 * 父子组件：组件的相互调用中，我们把调用者称为父组件，被调用者称为子组件
 * 在这里Father.js 是父组件，Son.js是子组件
 *
 * 把父组件的对象传给子组件
 */

class Father  extends React.Component {
    constructor(props) {
        super(props);
        this.state={
            title:'父组件的标题',