尝试思考一种在 React 中创建功能标志的方法

Trying to think an approach for creating a feature flag in React

我正在尝试在我的 React 项目中创建一个功能标志(我相信我必须在 appsettings.json 文件中添加一个功能标志),该标志是为了隐藏当前正在开发的功能因为我们不希望用户在这些功能尚未经过全面测试时拥有这些功能。所以我目前的方法是用 if(flag){new code} 之类的条件包装新开发的代码如果这种方法看起来很愚蠢,我很抱歉,但这就是我作为菜鸟所能想到的,你们也可以如果可能的话,请提供一些可行的方法?

所以我尝试将 if 条件添加到代码库中的现有功能,因为新开发的代码尚未提交,但它没有用。

根据你三个小时前的评论,我能够弄清楚你到底想做什么。

所以:已经有了旗帜,所要做的就是使用它。您至少可以通过三种方式进行操作:

  1. 让它隐藏 - 我认为 MDN docs 解释得很好
  2. 使其透明 - 这就是您所做的:将不透明度设置为 0
  3. 根本不渲染它

不渲染是这样实现的:

return (    
  <SomeParentComponent>
    {EnableDivision &&
      <Division/>
    }
  </SomeParentComponent>
)

并不是其中一个比其他的更好:它们都是视情况而定的。

  1. 隐藏元素被渲染,因此具有状态并且可以在 DOM 树中找到,但不带任何 space
  2. 透明就像隐藏一样,但是占了space
  3. 另一方面,无法在 DOM 树中找到未呈现的内容,不采用任何 space,创建它的函数或 class 永远不会 运行 因此它也不能有任何状态

希望这会打消您对如何操作的疑虑。

此外,如果您需要在组件树的不同位置的许多不同组件中使用一些标志,请查看 React Context 的作用。