如何实现反应回调

时间:2016-11-24 01:19:57

标签: reactjs checkbox callback

我很反应,我正在处理注册页面复选框元素

以下是选择组件实施,

const ChoiceItem = ( { options, itemId, selectedIndex, onChange } ) => (
  handleChange: function(checked){
    const value = [];
    options.map( option, i ) => (
      value[ i ] = checked;
    )

  },
  <Card>
    {
      options
      .map( ( option, i ) => (
        <Checkbox
          id={ `Choiceitem-checkbox-${ i }-${ itemId }` }
          key={ i }
          label={ option.text }
          style={ styles.checkbox }
          value={ '' + i }
          onChange={ ( checked ) => onChange( itemId, [ i ], checked ) }
        />
      ) )
    }
  </Card>
);

我想在这里做的是遍历选项并将值输入到名为value的数组中,并在注册表单中回调handleAnswerChange并在那里设置值。任何人都可以告诉我如何存档吗?
谢谢。

2 个答案:

答案 0 :(得分:0)

对你来说,最好的解决方案就是双向绑定。您可以查看添加双向绑定的反应文档。

react two way binding

另一种选择是使用jquery

答案 1 :(得分:0)

你实际上非常接近这个。我会更新handleChange中的MultipleChoiceItem

handleChange = (index) => (checked) => {
  const newValues = options.map((option, i) => {
    // if it is the changed returned the new state
    // otherwise just return the current value
    return index === i ? checked : option;
  });
  this.props.onChange(this.props.itemId, newValues);
};

然后在你的渲染中我会设置onChange

onChange={this.handleChange(i)}

然后,应在每个复选框点击时更新MyRegisterForm上的状态。