时间戳

首页 > 解决方案 > 我们可以使用 react native 为整个班级做隐藏和显示吗

reactjs - 我们可以使用 react native 为整个班级做隐藏和显示吗

问题描述

在我的 App.js 中，我有两个类。因此，当我单击一个类中的添加按钮时，应通过隐藏第一个类视图来显示第二个类视图。

标签： reactjsreact-native

解决方案

如果你在谈论类，那么你可以这样做：

  const Foo = () => {
     const [showClass, setShowClass] = useState(false);
     return (
        <div>
          <div className={showClass ? "showClass" : "hideClass">
              Only show after click
          </div>
          <div className={!showClass ? "showClass" : "hideClass"}>
              Show when not clicked
          </div>
          <button onClick={() => setShowClass(true)}>Click me</button>
        </div>
     )
  };

然而，在反应中，约定是不使用类，而是进行条件渲染：

  const Foo = () => {
     const [showElement, setShowElement] = useState(false);
     return (
        <div>
          {
            showElement ?
              <div>
                  Only show after click
              </div>
            :
              <div>
                  Show when not clicked
              </div>
          }

          <button onClick={() => setShowElement(true)}>Click me</button>
        </div>
     )
  };

推荐阅读