react组件引用本地图片并进行标记 生成csv本地文件

引用

我最近在使用react写网页，有一个需求是：在前端读取本地的图片文件，在react组件中显示，并且对图片文件进行标记。标记的结果存在本地csv文件中。

效果

实现

下面的实现只是思路以及核心代码，全部代码可移步Github。

为了使得标记可以自行修改，所以我把图片当作div的背景图片显示。标记当作div的p元素。render()函数很简单：

    render(){
            return(
                <Layout className={'image-card-layout'}>
                    <Card
                        className={'image-card'}
                        key={'image'+`${this.state.pic_path}`}
                        title={now_number+1+'frame'} 
                        hoverable
                        extra={
                        <Button type="primary" onClick&#