You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
A React component should not cause side effects in other components during rendering.
14
+
React コンポーネントは、レンダー中に他のコンポーネントに副作用を起こしてはいけません。
15
15
16
-
It is supported to call `setState`during render, but [only for *the same component*](/docs/hooks-faq.html#how-do-i-implement-getderivedstatefromprops). If you call `setState`during a render on a different component, you will now see a warning:
Warning: Cannot update a component from inside the function body of a different component.
20
20
```
21
21
22
-
**This warning will help you find application bugs caused by unintentional state changes.** In the rare case that you intentionally want to change the state of another component as a result of rendering, you can wrap the `setState`call into `useEffect`.
When dynamically applying a `style`that contains longhand and shorthand versions of CSS properties, particular combinations of updates can cause inconsistent styling. For example:
@@ -34,23 +34,23 @@ When dynamically applying a `style` that contains longhand and shorthand version
34
34
</div>
35
35
```
36
36
37
-
You might expect this `<div>`to always have a red background, no matter the value of `toggle`. However, on alternating the value of `toggle`between`true`and`false`, the background color start as `red`, then alternates between `transparent`and`blue`, [as you can see in this demo](https://codesandbox.io/s/suspicious-sunset-g3jub).
**React now detects conflicting style rules and logs a warning.** To fix the issue, don't mix shorthand and longhand versions of the same CSS property in the `style`prop.
[String Refs is an old legacy API](/docs/refs-and-the-dom.html#legacy-api-string-refs)which is discouraged and is going to be deprecated in the future:
In the future, we will provide an automated script (a "codemod") to migrate away from String Refs. However, some rare cases can't be migrated automatically. This release adds a new warning **only for those cases** in advance of the deprecation.
**You most likely don't have code like this**. If you do and it is intentional, convert it to [`React.createRef()`](/docs/refs-and-the-dom.html#creating-refs)instead:
@@ -99,86 +99,86 @@ class ClassParent extends React.Component {
99
99
}
100
100
```
101
101
102
-
> Note
102
+
> 補足
103
103
>
104
-
> To see this warning, you need to have the [babel-plugin-transform-react-jsx-self](https://babeljs.io/docs/en/babel-plugin-transform-react-jsx-self)installed in your Babel plugins. It must _only_ be enabled in development mode.
[`React.createFactory`](/docs/react-api.html#createfactory)is a legacy helper for creating React elements. This release adds a deprecation warning to the method. It will be removed in a future major version.
When React 16 was released, `createPortal`became an officially supported API.
122
+
React 16 がリリースされたとき、`createPortal`は公式にサポートされる API になりました。
123
123
124
-
However, we kept `unstable_createPortal`as a supported alias to keep the few libraries that adopted it working. We are now deprecating the unstable alias. Use `createPortal` directly instead of `unstable_createPortal`. It has exactly the same signature.
React adds component stacks to its development warnings, enabling developers to isolate bugs and debug their programs. This release adds component stacks to a number of development warnings that didn't previously have them. As an example, consider this hydration warning from the previous versions:
133
133
134
-
While it's pointing out an error with the code, it's not clear where the error exists, and what to do next. This release adds a component stack to this warning, which makes it look like this:
137
137
138
-
This makes it clear where the problem is, and lets you locate and fix the bug faster.
138
+
これにより、問題がどこにあるのかが明確になり、より早くバグの場所を特定して修正することができます。
139
139
140
-
### Notable bugfixes {#notable-bugfixes}
140
+
### 注目すべきバグ修正 {#notable-bugfixes}
141
141
142
-
This release contains a few other notable improvements:
142
+
このリリースには、他にもいくつかの注目すべき改善点が含まれています。
143
143
144
-
-In Strict Development Mode, React calls lifecycle methods twice to flush out any possible unwanted side effects. This release adds that behaviour to `shouldComponentUpdate`. This shouldn't affect most code, unless you have side effects in `shouldComponentUpdate`. To fix this, move the code with side effects into `componentDidUpdate`.
-In Strict Development Mode, the warnings for usage of the legacy context API didn't include the stack for the component that triggered the warning. This release adds the missing stack to the warning.
146
+
- Strict 開発モードでは、レガシーコンテクスト API の使用に関する警告には、警告のトリガとなったコンポーネントのスタックが含まれていませんでした。このリリースでは、欠けていたスタックが警告に追加されます。
147
147
148
-
-`onMouseEnter` now doesn't trigger on disabled `<button>`elements.
- ReactDOM was missing a `version`export since we published v16. This release adds it back. We don't recommend using it in your application logic, but it's useful when debugging issues with mismatching / multiple versions of ReactDOM on the same page.
0 commit comments