react报错，setState没有定义，是this指向问题

最新推荐文章于 2023-09-05 10:08:55 发布

孙憨憨

最新推荐文章于 2023-09-05 10:08:55 发布

阅读量326

点赞数

分类专栏： react 文章标签： react

本文链接：https://blog.csdn.net/weixin_42402812/article/details/106502150

版权

react 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

上传图片的时候，onchange 上传文件改变时的状态的方法，报这个错误,this指向改变，用箭头函数

export default class ModalFrom extends Component {
  constructor(props) {
    super(props);
    this.params = {
      name: 'picture',
      action: '/api/leju/admin/material/uploadAndSaveImg',
    };
    this.state = {
      imgSrc: '',
    };
  }
  // 上传文件改变时的状态用箭头函数，this指向就对了
  handleChange = (info) => {
    console.log(info, 'info===');
    if (info.file.status !== 'uploading') {
      console.log(info.file, info.fileList);
    }
    if (info.file.status === 'done') {
      this.setState({
        imgSrc:info.fileList[0].response.ossUrl
      })
    } else if (info.file.status === 'error') {
      message.error(`上传失败，请重新上传`);
    }
  };
  render() {
    return (
      <div>
        <Form onFinish={onFinish}>
          <Form.Item name="img" label="图片" rules={[{ required: true, message: '请上传图片' }]}>
            <Upload {...this.params}  onChange={this.handleChange}>
              <Button size="small" type="primary">
                上传图片
              </Button>
            </Upload>
            <img src={this.state.imgSrc} art=""></img>
          </Form.Item>
        </Form>
      </div>
    );
  }
}