如何在react redux中返回另一个类函数

Question

＆＃13;

＆＃13;

...

class AddForm extends Component {
  constructor() {
    super();
  }
  
  getValue() {
    let refsValue = [{
    	price: this.refs.price.value,
    	remarks: this.refs.remarks.value
    }];

    return refsValue;
  }
  
  render() {
    return (
      <div>
        <input type="number" name="price" ref="price" />
        <input type="text" name="remarks" ref="remarks" />
      </div>
    );
  }
}

class BankForm extends Component {
  constructor() {
    super();
    
    this.onSubmit = this.onSubmit.bind(this);
  }
  
  onSubmit() {
    console.log(getValue());
  }
  
  render() {
    return (
      <div>
        <button onClick={ this.onSubmit }>Submit</button>
      </div>
    );
  }

...

＆＃13;

＆＃13;

＆＃13;

我如何从getValue返回onSubmit？

getValue() { ... return refsValue; } -> onSubmit() { console.log(getValue()) }

请更正onSubmit的内容！

抱歉我的英语不好

Answer 1

这些看起来像两个单独的类。它们根本没有关联，因此您将无法获得任何值。

您需要在BankForm中重构和渲染AddForm。我建议将AddForm作为无状态组件并通过getValues（或将getValues的内容放在onSubmit中）作为onSubmit作为prop。

class BankForm extends Component {
   constructor() {
     super();
     this.onSubmit = this.onSubmit.bind(this);
   }

   onSubmit(e) {
     e.preventDefault();
     console.log(e.target.price.value);
   }

   render() {
      return (
        <AddForm onSubmit={this.onSubmit} />
      );
   }
}

function AddForm(props) {
   return (
      <div>
        <form onSubmit={props.onSubmit}>
           <input type="number" name="price" />
           <input type="text" name="remarks" />
           <button type="submit">Submit</button>
        </form>
      </div>
    );
}

https://jsfiddle.net/mb3m0jgd/1/