2018-03-07upoad file

{editing ? (
  <input 
    type="file"
    accept=".jpg, .jpeg, .png" 
    onChange={(e: any) => this.handleImageChange(e)} />
) : null}

原生输入框改变事件 ，采用异步方式.。
URL.createObjectURL把图片转成base64位编码格式展示。
通过this.props.onChange(file)调用上传方法。

 async handleImageChange(e: any) {
   const url = URL.createObjectURL(e.target.files[0])
   const file = e.target.files[0]
   await this.props.onChange(file)
   this.setState({ url })
 }  

redux部分

export default connect<{}, StateProps>(
  Overview,
  { styles },
  {
    mapModelToProps(customer, { storeId, customerId }, editing) {
      return {
        customer,
        storeId,
        customerId,
        editing,
      }
    },
    mapChangeToProps: {
      onChange: handler => (values: any) => handler(values, "avatar"),
    },
  },
)   

屏幕快照 2018-03-07 11.54.52.png 屏幕快照 2018-03-07 11.55.02.png

添加折扣的接口请求和页面：

1.png 2.png 3.png 4.png 5.png