react购物车的三个组件的分离的头部写法

header.js

import React, { Component } from 'react'

import shoppigcar from "../../css/shoppingcar.module.css";

export default class Header extends Component {

    constructor(props){

        super(props);

    }

    render() {

        return (

            <>

                 <div>

                    <div className={shoppigcar.item}>

                        <input type='checkbox' checked={this.props.ischeckedall} onChange={(e) => {

                            // alert(e.target.checked)

                            this.props.changeCheckedAll(e.target.checked);

                        }} />全选

                    </div>

                    <div className={shoppigcar.item}>商品名称</div>

                    <div className={shoppigcar.item}>商品价格</div>

                    <div className={shoppigcar.item}>商品数量</div>

                    <div className={shoppigcar.item}>商品小计</div>

                    <div className={shoppigcar.item}>操作</div>

                </div>

            </>

        )

    }

}