REACT - defaultChecked不会在第二次加载时呈现检查属性

时间:2015-10-14 17:01:55

标签: reactjs radio-button react-router react-jsx

当我第二次进入/ view /:id时,我得到了我的组件,它不会检查收音机。我从我的列表组件开始,在网站的索引处使用react-router,我点击一个元素的视图按钮,收音机被检查,我在列表中返回并转到另一个或相同的元素,它就是'不再检查了。当我在React开发人员工具中检查组件时,收音机具有defaultChecked = true属性。

import React from 'react';
import { connect } from 'react-redux';

class LicenseRadios extends React.Component {
  buildRadios() {
    let { licenses, activeValue } = this.props;

    return licenses.map(license => {
      let checked = false;

      if(activeValue !== undefined && activeValue === license.id){
        checked = true;
      }

      return (
        <div key={license.id} className="col l2">
          <p>
            <input name="license" type="radio" id={'licenseRdo_' + license.id} value={license.id} defaultChecked={checked} />
            <label htmlFor={'licenseRdo_' + license.id}>{license.label}</label>
          </p>
        </div>
      );
    });
  }

  render() {
    return (
      <div className="row">
        {this.buildRadios()}
      </div>
    );
  }
}

export default LicenseRadios;

我尝试更改defaultChecked属性的checked,但它需要onChange事件。我不明白这个问题。请有人帮帮我吗?

谢谢

1 个答案:

答案 0 :(得分:2)

defaultChecked道具仅在初始渲染期间使用。如果需要在后续渲染中更新值,则需要使用onChange函数来处理值更改。

查看文档中的controlled components,以便更好地了解您遇到的问题。