Question

我有一个反应组件如下：

<Child />

input[type="file"]中有<Parent />表单控件。

当我点击<Child />中的按钮时，我想在input[type="file"]中使用ajax上传文件，

如何访问<Child />内的refs？

我尝试使用<Parent> <Child ref="child"/> <button type="button" /> </Parent>

input

以便我可以通过编写

来访问

this.refs.child.refs.file

 private Form1 mainForm = null;
public Form2(Form callingForm)
    {
        mainForm = callingForm as Form1;
        InitializeComponent();
    }

    public static Form2 Instance
    {
        get
        {
            if (instance == null)
            {
                instance = new Form2(Application.OpenForms[0] as Form1);
            }
            return instance;
        }
    }

但我认为这不是最佳做法....

Answer 1

在家长中：

_handleImageUpload(image) {
  this.setState({
    image: image
  });
}

<Child onImageUpload={this._handleImageUpload} />

在孩子：

_handleSubmit(e) {
  e.preventDefault();
  this.props.onImageUpload(this.state.file);
}

_handleImageChange(e) {
  e.preventDefault();
  let file = e.target.files[0];

  reader.onloadend = () => {
    this.setState({
      file: file
    });
  }
}

从孩子渲染：

<form onSubmit={this._handleSubmit}>
  <input type="file" onChange={this._handleImageChange} />
  <button type="submit" onClick={this._handleSubmit}>Upload Image</button>
</form>

Answer 2

将您的子组件设为＆＃34; Controlled Component＆＃34;。

alter table TABLE_NAME modify (COLUMN_NAME null);

有关详细说明，请转到here

React：从父级获取子组件数据

2 个答案: