即使道具是假的，复选框也会保持检查状态

Question

我检查网址是否有值，然后确定该复选框是否处于检查状态..这只是装饰性的，复选框不可点击。

<input
  type="checkbox"
  checked={inCurrentFilters({ key: bucket.key, dotField, currentFilters })}
/>
{inCurrentFilters({ key: bucket.key, dotField, currentFilters }) ? 'true' : 'false'}

当inCurrentFilters返回true时，系统会选中该复选框，并在其旁边显示true。然后，当它返回false时，复选框保持选中状态，值为false。是什么赋予了？

Answer 1

您自己的解决方案是解决问题的最简单方法。您呈现的复选框是一个输入元素，因此默认情况下用户可以单击它。由于您没有将其用作输入，pointer-events: none可以解决问题。

从用户体验的角度来看，最好使用复选框disabled，或者使用两个看起来不同的图标。

通过显示默认复选框，您实际上是在告诉用户他们可以单击复选框，而不应该这样。

Answer 2

所以......有趣的是，它是可点击的，我通过点击它来覆盖功能状态。我添加了pointerEvents: none。这解决了这个问题，但还有更好的方法吗？