react购物车的底部的分离的写法

footer.js

import React, { Component } from 'react'

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

export default class Footer extends Component {

    constructor(props){

        super(props);

    }

    render() {

        return (

            <>

                 <div>

                    <div className={shoppigcar.item} onClick={()=>{

                        this.props.delAll()

                    }}>

                        批量删除

                    </div>

                    <div className={shoppigcar.item}>

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

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

                        {this.props.num}

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

                        {this.props.price}

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

                    </div>

                </div>

            </>

        )

    }

}