react组件传值（属性props)

最近开始学习react，然后记录一下觉得不错的方法，以便我随时回来复习。
首先需要新建两个页面

Data.jsx代码

import React from 'react'
import Child from './Child'//引入组件

class Datamount extends React.Component {
    render() {
        return (
            <>
            <div>Datamount</div>
            //设置默认值的时候是不用写title的
            <Child title="parent"></Child>
            </>
        )

    }
}
export default Datamount

Child.jsx代码 （有两种方法可以传值，结果都是一样的：childparent）

import React from 'react'
// 类组件
// class Datamount extends React.Component {
//     render() {
//         return (
//             <>
//             <div>child{this.props.title}</div>
//             </>
//         )

//     }
// }
// export default Datamount

// 函数式组件/无状态组件
export default (props)=>{
    return(
        <div>child{props.title}</div>
    )
}

还可以传默认属性值
只需要在类组件里加上静态属性就可以在父组件没有传值的情况下显示你默认的数据

    // 静态属性
    static defaultProps={
        title:'ssllaf'
    }
    render() {
        return (
            <>
            <div>child{this.props.title}</div>
            </>
        )

    }
}

或者是这样

class Datamount extends React.Component {
    // 静态属性
    // static defaultProps={
    //     title:'ssllaf'
    // }
    render() {
        return (
            <>
            <div>child{this.props.title}</div>
            </>
        )

    }
}
// 静态属性可以直接通过类调用
Datamount.defaultProps={
    title:'default'
}

还可以通过函数式组件来设置默认值

export default function Datamount (props){
    return(
        <div>child{props.title}</div>
    )
}
Datamount.defaultProps={
    title:'default'
}

如有错误请指出。