no-null-ternary.md

no-null-ternary

Forbids placing null on one side of a ternary operator inside a JSX section.

Examples

Correct

class Example extends Component {
  render() {
    return <>{condition ? "Example" : "Other example"}</>;
  }
}

function Example() {
  return <>{condition ? "Example" : "Other example"}</>;
}

class Example extends Component {
  render() {
    return <>{condition && "Example"}</>;
  }
}

function Example() {
  return <>{condition && "Example"}</>;
}

class Example extends Component {
  render() {
    return <>{!condition && "Example"}</>;
  }
}

function Example() {
  return <>{!condition && "Example"}</>;
}

Incorrect

class Example extends Component {
  render() {
    return <>{condition ? "Example" : null}</>;
  }
}

function Example() {
  return <>{condition ? "Example" : null}</>;
}

class Example extends Component {
  render() {
    return <>{condition ? null : "Example"}</>;
  }
}

function Example() {
  return <>{condition ? null : "Example"}</>;
}