react bootstrap checkbox issue

Using react-bootstrap, I want a checkbox on my form to be checked when my 'inactive' value is true; and not checked when it's false. So I set the checked attribute to:

checked={this.state.inactive}

However, I get this error when I click the checkbox: "Warning: Received the string false for the boolean attribute checked. The browser will interpret it as a truthy value. Did you mean checked={false}?"

Here's the relevant code:

render() {
  const {
    inactive,
    ...
  } = this.state;

  return (
    <Form.Group as={Row}>
      <Form.Label>Inactive<Form.Label>
      <Col>
        <Form.Check
          type="checkbox"
          checked={this.state.inactive}
          onChange={() => {
            if (inactive === 'false') {
              this.setState({ inactive: 'true' });
            } else {
              this.setState({ inactive: 'false' });
            }
          }}
        />
      </Col>
    </Form.Group>
    );
  } 
}

So then I changed the checked attribute to the following. But in this case, the the value does not get set correctly when false:

...
      checked={inactive === 'true'}
...