text: import {Upload, Icon, Modal} from 'antd';
  
  class PicturesWall extends React.Component {
    constructor(props){
      super(props);
      //  处理默认图片
      let fileList = [];
      if(this.props.fileList){
        fileList = this.props.fileList.split(',').map(item => {
          return {
            uid: item,
            name: item,
            status: 'done',
            url: item,
          }
        });
      }
      this.state = {
        previewVisible: false,
        previewImage: '',
        fileList: fileList
      };
    }
  
    handleCancel = () => this.setState({previewVisible: false})
  
    handlePreview = (file) => {
      this.setState({
        previewImage: file.url || file.thumbUrl,
        previewVisible: true,
      });
    }
  
    handleChange = ({fileList}) => {
      this.setState({fileList});
      this.props.handleFileList(this.state.fileList);
    }
  
    render() {
      const {previewVisible, previewImage, fileList} = this.state;
      const uploadButton = (
        <div>
          <Icon type="plus"/>
          <div className="ant-upload-text">Upload</div>
        </div>
      );
      return (
        <div>
          <Upload
            action="/haoke/pic/upload"
            listType="picture-card"
            fileList={fileList}
            onPreview={this.handlePreview}
            onChange={this.handleChange}
          >
            {fileList.length >= 5 ? null : uploadButton}
          </Upload>
          <Modal visible={previewVisible} footer={null} onCancel={this.handleCancel}>
            <img alt="example" style={{width: '100%'}} src={previewImage}/>
          </Modal>
        </div>
      );
    }
  }
  
  export default PicturesWall;
  