我对具有四种形式的应用程序有疑问。当组件卸载时，表单的每个页面都会执行 POST。每当用户离开页面时，都会发布表单信息，这是业务需求，因此我无法将逻辑移动到页面上的“下一步”按钮。

当表单的下一页加载时，它需要执行 GET。我的问题是 POST 可能需要一些时间，所以 GET 在 POST 之前被调用。

在将用户路由到发生 GET 的表单的下一页之前，如何等待 POST 服务调用完成。

这就是我在表格第一页中的内容。onSubmit 触发到下一页的路由，然后当组件卸载时，它会在到达下一页之前进行需要完成的服务调用。

在下一页我有 GET，它在我的 POST 完成之前完成。

我正在使用反应路由器。特别是浏览器路由器。提醒：我无法通过 onSubmit 更改 POST。每次用户离开页面时都需要发布帖子，以便将他们的数据保存到服务器。

任何想法都会有所帮助！

我使用'react-google-maps'

我的页面中有一些复选框和一个 GoogleMap 组件。当我单击复选框后更新反应状态时。GoogleMap 将卸载并再次安装。GoogleMap 不使用由复选框更改的状态。但谷歌地图仍然重新安装。

最奇怪的是GoogleMap卸载了。我认为 GoogleMap 应该重新渲染。然后我可以shouldComponentUpdate()用来防止 GoogleMap 重新渲染。但是当我使用与 GoogleMap 无关的状态设置状态时，它会触发卸载。

我GoogleMapDOM在render函数中声明，并GoogleMapDOM在html中使用''。我认为它是由在声明中引起GoogleMapDOM的render。我会看看。

渲染函数片段（）

有人可以帮助我吗？谢谢。

我需要访问匿名绑定函数之外的jqconsole变量。我如何在 JQuery 栖息地之外实例化它？如果可能的话，我会把它保存在全局或我的州。我没有设法让它以这种方式运行。

准确地说：我有这个类方法writeToConsole，并且想调用它而不必传递 jqconsole 的实例：

感谢您的时间和帮助。

就性能而言，哪一个是更好的方法第一或第二？

const getCookieValue = readCookie('my_var')应该在顶部声明，或者因为它的使用只在一个条件下，所以最好将它保留在if语句中

方法一

或者

方法二

}

所以我想通过firebase函数设置访问，然后将此访问道具作为道具传递给选项卡组件，但是选项卡组件的初始状态为null，之后firebase auth功能正在解析。

我正在学习 React 并正在开发 John Conway 的 Game of Life 应用程序。我在状态/构造函数中定义了一个二维数组，它创建了一个正方形游戏板。我有一个名为的函数isSquareAlive，它处理网格中的特定方块在生命游戏的意义上是否“活着”，并更新方块并将它们设置为如果用户点击它们则它们是活着的。我还有另一个名为selectBoardSize的函数，它允许用户单击按钮并调整板的大小。

当应用程序安装时，我会生成一个随机板，其中填充了一些设置为“活动”的方块，而另一些则没有。我在里面处理这个componentDidMount：

这工作正常。如果用户尝试通过selectBoardSize我想更改板的大小来调整板的大小，然后再次用随机的“活动”单元格填充它。这里是selectBoardSize：

当用户更改电路板尺寸时，我试图用来componentDidUpdate获取新的电路板尺寸并用该电路板尺寸的随机“活动”单元格填充它，就像我最初使用componentDidMount. 这是我遇到困难的地方。

这是我的componentDidUpdate：

当用户单击按钮来调整它的大小时，板成功地改变了尺寸，但它不会像它应该那样生成随机的“活动”方块。它只是改变了板的高度和宽度，但板是空的。

调整大小时如何使用componentDidUpdate随机“活动”单元填充游戏板（类似于最初安装时的操作，但在板改变大小时调整大小）。是componentDidUpdate正确的方法吗？这是 setState 异步的问题吗？

很确定我想多了。

您可以在codesandbox上查看代码。

我们正在使用 React 开发一个巨大的应用程序。我们的一种形式包括 60 多个放置在不同选项卡项上的组件。

当我尝试编辑输入时，需要 190 毫秒才能在文本框中看到键入的字符。在挖掘了几个小时的问题后，我们意识到添加一个组件会增加响应时间。然后我们确定问题出在antdesign的渲染逻辑上。然后我们使用“why-did-you-update”包对 PrimeReact 进行了尝试。结果是一样的！

当状态发生任何变化时，所有组件（包括图标 :)）都会尝试根据“你为什么更新”消息来呈现。

这是沙箱：https ://codesandbox.io/s/6w30ro2l9w

“你为什么更新”消息是错误的还是我们遗漏了什么？

编辑：经过进一步测试，我意识到 componentDidMount 的行为符合我的预期，但这似乎是我的随机函数的一个问题，如果它再次运行，由于某种原因返回未定义，所以在初始安装时它会给我结果，当我再次安装它时，它返回未定义，因此没有任何渲染......

我进行了研究以了解为什么我会遇到这个问题。我有一个 webapp 组件，它只是一个将呈现赞助商名称的横幅。每次渲染此横幅时，我都想随机化赞助商出现的顺序。我可以让它工作，但它只在第一次渲染时发生（在 componentDidMount() 上），然后每次我访问该组件被渲染的任何部分时，它不再调用 componentDidMount()，因此它不渲染任何内容。

起初我认为 componentDidMount() 应该在每次进入调用该组件的部分时调用。阅读后，到处都说组件被安装一次，这就是为什么它只调用一次函数。我怎样才能让它在每次渲染组件时随机化？

这是我正在编写的代码示例。

该组件在应用程序的 2 个不同部分中呈现。这是一个非常简单的应用程序，我什至没有向它添加路由。它只是完全作为一个 SPA 工作。当用户单击一个部分时，它会呈现该组件。在第一次加载时，如果我访问呈现此组件的部分，它会显示一个随机数组。如果我导航到另一个部分并返回，它会呈现一个空横幅。

为什么会发生这种情况，我该如何解决？

问题

*这不完全是我的情况，但这很重要。
想象一个呈现元素列表的应用程序：

元素保持在渲染的父组件的状态ElementsList。每个元素都是一个简单的对象：

每个元素与附近的输入字段一起呈现以更改其文本：

考虑到可能有很多元素（应用程序可以处理的越多越好）。
现在的问题是我们应该如何通过这些输入来更新文本。

解决方案

我看到 2 个选项（它们的一些组合是可能的）：

1.正确的反应方式（是吗？） - 通知父组件有关更改

• 在元素：onChange={evt => onTextChange(evt.target.value)}
• 在元素列表：onTextChange={newText => onElementTextChange(el, newText)}
• 在父组件：onElementTextChange={ (element, newText) => {make new elements array with the updated element somehow; setState(elements)} }

该解决方案似乎难以实施。与下面的替代方案相比，它也很慢。输入更改时发生的事件（如果我错了，请纠正我）：

1. 通过组件链通知父组件有关更改
2. 父组件构造新元素数组并调用setState
3. 整个虚拟 DOM 得到更新（包括每个元素）
4. 更新的虚拟 DOM 与之前的虚拟 DOM 版本进行比较
5. 一个元素在真实 DOM 中更新

2.直接更新Element的propsforceUpdate()

• 将 Element 重写为类而不是功能组件
• 在元素处：onChange={evt => {element.text = evt.target.value; this.forceUpdate()}}

输入更改时发生的事件：

1. props.element.text 被改变并被forceUpdate调用
2. 虚拟 DOM 中只有一个元素被更新
3. 将虚拟 DOM（一个元素）的更新子树与旧虚拟 DOM 进行比较
4. 一个元素在真实 DOM 中更新

问题

目前我正在使用一种中间方法，但更多的是在“适当的反应方式”方面。而且速度还不够快。
我更喜欢第二种选择，它需要更少的代码，而且看起来它应该工作得更快（理论上）。

1. 使用第二种方法会显着提高性能吗？（记住有成千上万的元素）
2. 这种方法会导致哪些具体问题？是的，是的，我知道代码不那么透明，这不是它的本意。
3. 您还有其他提高性能的方法吗？我很乐意尝试更少的类似反应的建议，可能会考虑部分或完全放弃反应。

我正在使用 react js 和 node js api 实现一个简单的用户认证系统。这就是我在ComponentWillMount方法中所做的：-

1.检查令牌是否退出（在localStorage中）
2.如果不退出，则状态“令牌”的值将保持空白
3.如果存在，则使用后端请求检查它是否有效。
4.如果令牌有效，则将'token'声明为localstorage.token
5.如果令牌无效，则状态'token'的值将保持空白

在渲染方法中，我添加了基于状态“令牌”的值的条件渲染，即如果状态“令牌”为空白，则将渲染正常页面，否则将重定向到用户页面。

问题是我可以使用任何反应开发工具更改状态“令牌”的值。这导致了使用假令牌登录的漏洞。为避免每次使用诸如componentDidUpdate shouldComponentUpdate之类的生命周期方法之一更改状态“令牌”时，我都必须检查状态“令牌”的有效性。

但正如react shouldComponentUpdate官方文档中提到的，它只是作为性能优化存在的。不要依赖它来“阻止”渲染，因为这可能会导致错误。

使用componentDidUpdate没有用，因为它会在组件由于状态更改而发生更改后被调用。

使用componentWillUpdate在官方文档中被称为 Unsafe

我不确定如何解决这个漏洞。这是组件的代码