在一个html标记中包含两个javascript代码：jsx语法问题

Question

在我的react组件中，我正在尝试使用返回的jsx代码进行渲染，但是它不起作用（语法错误）：

<button onClick={this.refresh} {isFetching && 'disabled'}>Refresh</button>

以下工作正常（但不是我想要的）：

<button onClick={this.refresh}>{isFetching && 'disabled'}Refresh</button>

为什么此语法错误？如何将我的按钮显示为禁用状态？

Answer 1

您只想将布尔值作为disabled道具的值即可。

<button onClick={this.refresh} disabled={!!isFetching}>Refresh</button>