Question

当我有props.a时，如何设置'已检查'？我不明白如何写点东西，比如：

<input if (props.a > x) {checked='checked'}/>

我尝试了<input {props.a > x ? 'checked' : ''}/>，但我遇到了错误

Answer 1

您应该使用<input checked={ (props.a > x) } />。

Answer 2

你可以在一个componentWillReceiveProps函数中对已检查状态值进行分配并控制此状态，因为只要道具发生变化就会调用它像

componentWillReceiveProps(nextProps) {
    if(nextProps.a > x) {
         this.setState({checked: 'checked'});
    }

}

<input checked={this.state.checked}/>

或者你可以直接在put中返回一个像

这样的道具

<input checked={(props.a > x)? 'checked': null}}/>

class App extends React.Component {
  render() {
    var a = 10;
    var x = 9;
    return (
      <div>
      <input type="checkbox" checked={(a > x)? 'checked': null}/></div>
    )
  }
}

ReactDOM.render(<App/>, document.getElementById('app'));

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
<div id="app"></div>

输入时如何使用？

2 个答案: