是什么导致网页重新加载？
What is causing the web page to reload?
我构建了一个简单的服务来撰写一系列推文，http://tweetsmart.in 使用 React 和 Flux。我遇到了一个奇怪的错误，当用户登录并首次单击推文按钮时，页面会重新加载。
如果第二次单击推文按钮，一切都会按预期进行。登录后我才第一次注意到这种行为。 tweet 按钮只是一个锚标记，因此不是导致此问题的按钮的默认提交行为。
重现错误的步骤：
- 转到http://tweetsmart.in/popup.html
- 使用 Twitter 登录
- 登录后，在文本框中输入内容。
- 点击推特按钮发送推特。
您会发现页面重新加载并且推文失败，但我不确定哪个先发生。当我打开 Chrome 开发人员工具并查看网络选项卡时，我发现对推文的 api 调用被取消，接下来发生的事情是页面重新加载。在我看来，页面重新加载导致 api 调用取消。
但是，我在我的代码中放入了一些日志语句进行调试，但我发现了一个异常。单击 Tweet 按钮后，将调度一个 Action 将 Tweets 排队，然后如果有任何排队的 Tweets，则将调度一个后续 Action 以发送第一个排队的 Tweet。这导致 Api 调用 tweetsmart，它被包装在一个 Promise 中，并且只有当 Promise 成功或失败时，才会将进一步的 Actions 分派到 Store。
但是，从控制台上的日志语句中，我发现我的主要 React 组件的 componentDidUpdate 在页面重新加载之前被调用了。如果推文不成功，Dominic Decoco 将被记录。参见 https://github.com/singhshashi/tweetsmart/blob/master/js/components/TweetSmartApp.react.js
因为我没有向商店发送任何操作，所以我不确定是什么导致反应组件更新。发生这种情况仅仅是因为页面重新加载吗？这会导致页面重新加载吗？
============更新 1========
React 组件更新，因为 api 调用被取消，因此 TWEET_FAILED 操作是 dispatched.I 认为 api 调用被取消的原因是因为重新加载被触发。问题是什么触发了页面重新加载？
当您的推文失败时，您调用 updateStateOnTweetFailed 将执行以下调度：AppDispatcher.dispatch({actionType:TweetSmartActions.TWEET_FAILURE});。您的商店会侦听此 actionType 并将发出一个更改，这会导致您重新渲染，从而使您的 React 组件自行更新。另一方面，我不确定页面是否重新加载。值得检查您是否正在调用页面重新加载作为此操作的结果。
好的，我发现了问题。
Tweet 按钮是一个没有 href 属性的锚标记，因此它的 href 指向当前页面 url 导致页面在单击时重新加载。
虽然我不确定这是否是有意为之的行为，但我会进一步调查并 post 如果发现任何异常情况，我会提出另一个问题。我怀疑这可能是 jsx 如何翻译成 html 的一些错误，因为在 html5 中可以有没有 href 属性的锚标记。请参阅 https://developer.mozilla.org/en/docs/Web/HTML/Element/a
的 href
我现在的解决方案是将锚标记更改为 type=button 的按钮标记。
我构建了一个简单的服务来撰写一系列推文，http://tweetsmart.in 使用 React 和 Flux。我遇到了一个奇怪的错误，当用户登录并首次单击推文按钮时，页面会重新加载。
如果第二次单击推文按钮，一切都会按预期进行。登录后我才第一次注意到这种行为。 tweet 按钮只是一个锚标记，因此不是导致此问题的按钮的默认提交行为。
重现错误的步骤：
- 转到http://tweetsmart.in/popup.html
- 使用 Twitter 登录
- 登录后，在文本框中输入内容。
- 点击推特按钮发送推特。
您会发现页面重新加载并且推文失败，但我不确定哪个先发生。当我打开 Chrome 开发人员工具并查看网络选项卡时，我发现对推文的 api 调用被取消，接下来发生的事情是页面重新加载。在我看来，页面重新加载导致 api 调用取消。
但是，我在我的代码中放入了一些日志语句进行调试，但我发现了一个异常。单击 Tweet 按钮后，将调度一个 Action 将 Tweets 排队，然后如果有任何排队的 Tweets，则将调度一个后续 Action 以发送第一个排队的 Tweet。这导致 Api 调用 tweetsmart，它被包装在一个 Promise 中，并且只有当 Promise 成功或失败时，才会将进一步的 Actions 分派到 Store。
但是，从控制台上的日志语句中，我发现我的主要 React 组件的 componentDidUpdate 在页面重新加载之前被调用了。如果推文不成功，Dominic Decoco 将被记录。参见 https://github.com/singhshashi/tweetsmart/blob/master/js/components/TweetSmartApp.react.js
因为我没有向商店发送任何操作，所以我不确定是什么导致反应组件更新。发生这种情况仅仅是因为页面重新加载吗？这会导致页面重新加载吗？
============更新 1========
React 组件更新，因为 api 调用被取消，因此 TWEET_FAILED 操作是 dispatched.I 认为 api 调用被取消的原因是因为重新加载被触发。问题是什么触发了页面重新加载？
当您的推文失败时，您调用 updateStateOnTweetFailed 将执行以下调度：AppDispatcher.dispatch({actionType:TweetSmartActions.TWEET_FAILURE});。您的商店会侦听此 actionType 并将发出一个更改，这会导致您重新渲染，从而使您的 React 组件自行更新。另一方面，我不确定页面是否重新加载。值得检查您是否正在调用页面重新加载作为此操作的结果。
好的，我发现了问题。
Tweet 按钮是一个没有 href 属性的锚标记，因此它的 href 指向当前页面 url 导致页面在单击时重新加载。
虽然我不确定这是否是有意为之的行为，但我会进一步调查并 post 如果发现任何异常情况，我会提出另一个问题。我怀疑这可能是 jsx 如何翻译成 html 的一些错误，因为在 html5 中可以有没有 href 属性的锚标记。请参阅 https://developer.mozilla.org/en/docs/Web/HTML/Element/a
的 href我现在的解决方案是将锚标记更改为 type=button 的按钮标记。