javascript - 我在输入类型文件中的 onChange 之后得到未命名状态 - ReactJS

标签 javascript reactjs image-upload react-state input-type-file

我正在使用输入类型文件将图像上传到strapi.io。我注意到在 react 开发工具的状态中它会生成一个未命名的状态,如下图所示。

enter image description here

状态

constructor(props) {
    super(props);
    this.state = {
      first_name: '',
      last_name: '',
      address: '',
      email:'',
      city: '',
      country: '',
      zipcode: '',
      gcash_number: '',
      paypal_email: '',
      error: '', 
      bank_account: '',
      bank_name: ''
    }
    this.handleOnChange = this.handleOnChange.bind(this)
  }

JSX

<div className='col-sm-auto'>
  <label htmlFor='avatar' >Avatar</label>
   <input type='file' className="form-control-file form-control-sm" onChange={this.handleOnChange('avatar')}/>            
</div>

handleOnChange函数

handleOnChange = input => (event) => {
    if (event.target.type === 'file') {
      this.setState({avatars: event.target.files[0]})
    }
    this.setState({
      [event.target.name]: event.target.value
    })
  }

有人可以向我解释一下这是怎么发生的吗?以及如何在其上添加州名?

最佳答案

this.setState({
    [event.target.name]: event.target.value
});

名称未定义

尝试

<input name="myInputName" type='file' className="form-control-file form-control-sm" onChange={this.handleOnChange('avatar')}/>  

关于javascript - 我在输入类型文件中的 onChange 之后得到未命名状态 - ReactJS,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60145822/

相关文章:

javascript - 在RaphaelJS中,如何将旋转的文本对齐到底部?

javascript - 获取 POST ReactJs 到 Controller .Net Core

javascript - 在另一个组件中使用函数时出错

python - “列表”对象没有属性 'startswith'

django - 在 Django : when to use save() vs chunks() vs cleaned_data? 中处理图像上传表单

javascript - C# 解密Javascript中加密的数据

javascript - 同步多个带有惯性效果的滚动div

javascript - 如何在angularjs中显示和隐藏基于 bool 值的元素属性?

python - React : NoReverseMatch: Reverse for 'password_reset_confirm' not found. 'password_reset_confirm' 不是有效的 View 函数或模式名称

javascript - Shutterstock:上传图片的API