Question

当我将其正确标记为true时，我的输入复选框始终返回true，但是当我未标记tb时，我会变为true。我希望复选框在选中时返回true，而在未选中时返回false，这样我会将逻辑应用于handlesubmit函数。


    handleChange = e => {
        const { name, value } = e.target;
        console.log(name, value);
        switch (name) {

          case 'period': this.json.schedule = 'period'; break;

    }


 <input
       type="checkbox"
       name="period"
       defaultValue
       onChange={this.handleChange}
 />

Answer 1

签出e.target.checked的值。

根据您的情况，更改以下行：const { name, value } = e.target以包括checked。

class App extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      checked: true
    }
  }
  
  handleChange = (e) => {
    const { checked } = e.target
    this.setState({
      checked: checked
    })
  }
  
  render() {
    return (
      <div>
        <input type="checkbox"
               onChange={e => this.handleChange(e)}
               defaultChecked={this.state.checked}/>
        {this.state.checked.toString()}
      </div>
    )
  }
}

ReactDOM.render((<App/>), document.getElementById('testing'))

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>

<div id="testing"></div>

Answer 2

您是否正在检查是否选中此框，请尝试：

result-view {
  match: LaunchUri(this)

  app-launch {
    payload-uri("#{value(this)}")
  }

  render {
    nothing
  }
}

Answer 3

您首先需要定义要考虑的检查？如果选中，则为true；如果未选中，则为false。这是一些入门的代码。

handleChange = e => {
    if (document.getElementByClassName("period").checked) {
        // box is checked
    } else {
        // box is unchecked
    }
}

如何使用React JS中的输入复选框返回true或false？

3 个答案: