在减速器中从 JSX {} 读取布尔值

Question

这是我在控制台日志中单击的结果，在调度时一切正常

我的代码是为了理解哪些是未定义的，哪些是真假

   <div className="App">
      <h1>Counter {counter}</h1>
      <button onClick={()=>dispatch(add())} className="btn btn-primary mr-1">+</button>

      <button onClick={()=>dispatch(remove())} className="btn btn-primary mr-1">-</button>

      <br/>
      <br/>
      <h1>Toggle {togRed} nor {String(togRed)} not even {togRed + ""}</h1>
      <h1>Testing bool {String(true)} and {false+""}</h1>
      <button onClick={()=>dispatch(tog())} className="btn btn-success">Toggle</button>
      {}
    </div>

我怎样才能像在控制台日志中点击切换按钮时那样在切换之后写入真假

Answer 1

在 JSX 中渲染布尔值正如您所期望的那样简单。

您的 prop/variable 值有问题，togRed 可能是 undefined 在您显示其内容的部分：

<h1>Toggle {togRed} nor {String(togRed)} not even {togRed + ""}</h1>

因为 String(true) 解析为 "true"，String(false) 解析为 "false" 而 String(undefined) 解析为“未定义”（正如我们在呈现的文本中看到的那样）在你的截图中显示“Toggle nor undefined not even undefined”。

在减速器中从 JSX {} 读取布尔值

Reading boolean from JSX {} in reducers

javascript

html

reactjs

redux

reducers