Question

我正在使用React为Cobalt创建一个小应用程序。除了一件事之外，现在一切看起来都很好：我不能在组件的状态变化上重新渲染一小段HTML。我左边有一个菜单，屏幕右边有相关的组件/ HTML。当我在菜单中更改选项时，我希望相应地更新正确的组件/ HTML。想象一下，我有7个菜单选项。对于所有这些，除了第5个，我想只显示选项文本。渲染方法中的代码如下所示：

this.state.selectedOption === 'fifthOption'
            ? <FifthComponent />
            : (
              <div className="wrapper">
                  <span className="title">{this.state.selectedOption}</span>
              </div>)

在Chrome中，一切都很完美，但在Cobalt因为某些原因我从第一个切换到第二个，第三个，第四个选项时 - 没有任何改变，并显示第一个选项的文本。但是当我从第5个选项切换到第4个或第6个时，它就改变了。控制台没有错误。因此看起来它不会在状态更改时重新呈现“包装器”（但是启动了渲染方法）。

我尝试在'div'中添加不同的类，将其作为'switch'构造，将这个'div'作为一个单独的组件 - 所有这些都没有运气。

任何帮助都会非常感激。

Answer 1

这更像是一个肮脏的黑客，然后是一个真正的答案，但我通过改变元素的标签解决了这个问题。因此，render方法的代码如下所示：

{{1}}

因此，每个下一个项目都与前一个项目的元素标记不同。可能只有当Cobalt看到新标签时才会重新呈现元素。

组件的状态更改

1 个答案: