Question

我有一个布尔道具反应，我正在尝试使用它，如下所示：

const MyComponent = ({ prop1, prop2, isBoolean }) => {
...do something..
return (
 if (isBoolean) ? (do this) : (do that)
}

所以我说如果isBoolean为true，那么就这样做吧。这是正确的语法吗？

Answer 1

如果你想在return ( expression )内进行条件渲染，你需要使用三元运算符。

const MyComponent = ({ prop1, prop2, isBoolean }) => {
    // ...do something..
    return (
       { isBoolean ? (do this) : (do that) }
    );
};

你也可以在return语句之前执行你的条件，如下所示：

const MyComponent = ({ prop1, prop2, isBoolean }) => {
    // ...do something..

    const DOMToRender = isBoolean ? this : that;

    return (
       { isBoolean ? (do this) : (do that) }
    );
};

您还可以使用和if / else语句补充const DOMToRender = isBoolean ? this : that;。

Answer 2

如果您想使用三元运算符，则必须删除if关键字。

isBoolean ? (do this) : (do that)

然后它确实是一个正确的语法。

Answer 3

不，这不是JS中的正确语法。您在一个语句中混合了if语句和tenary operator。正确的语法是：

如果声明

if (isBoolean) {
  //do this
} else {
  //do that
}

或tenary operator
```
isBoolean ? expression1 : expression2;
```

Answer 4

不，简单地说：

isBoolean ? this : that

或者，对于更复杂（多行）的代码：

if (isBoolean) {
  this
} else {
  that
}

Answer 5

如果可以在任何时候（例如默认情况下）未定义，你可以通过双重爆炸强制它为三元组的布尔值!!

return !!isBoolean ? (do this) : (do that)

React：布尔检查的正确语法是什么

5 个答案: