react条件渲染不满足条件时候会渲染出'0'

176 阅读1分钟

出问题的代码:

          {fileInfo?.size && fileInfo?.size > MAX_VIEW_FILE_SIZE && (
            <div>{f({ id: 'dataSet.detail.files.previewLimit.tips' })}</div>
          )}

fileInfo = { "name": "kong.txt", "createdAt": 1706860988000, "size": 0, "url": "", "textContent": "", "path": "/9999/kong.txt" }

时,页面中会渲染出'0',而不是空白。

修改如下:

          {!!fileInfo?.size && fileInfo?.size > MAX_VIEW_FILE_SIZE && (
            <div>{f({ id: 'dataSet.detail.files.previewLimit.tips' })}</div>
          )}

则正常渲染。

参考:

React的渲染"0"问题及源码分析