From 8d51b16431c923d62679315bebe3a599114bfb26 Mon Sep 17 00:00:00 2001 From: Dan Abramov Date: Sun, 25 Dec 2022 21:45:54 +0000 Subject: [PATCH] [Beta] Remove some duplicated banners --- beta/src/content/reference/react-dom/findDOMNode.md | 12 ------------ beta/src/content/reference/react-dom/hydrate.md | 12 ++---------- beta/src/content/reference/react-dom/render.md | 12 ++---------- .../reference/react-dom/server/renderToNodeStream.md | 12 ------------ .../react-dom/server/renderToStaticNodeStream.md | 5 ++--- .../reference/react-dom/unmountComponentAtNode.md | 12 ++---------- beta/src/content/reference/react/Component.md | 6 ------ beta/src/content/reference/react/createFactory.md | 12 ------------ beta/src/content/reference/react/createRef.md | 6 ------ .../content/reference/react/useInsertionEffect.md | 6 ------ 10 files changed, 8 insertions(+), 87 deletions(-) diff --git a/beta/src/content/reference/react-dom/findDOMNode.md b/beta/src/content/reference/react-dom/findDOMNode.md index 3ef72a83..7b3fab55 100644 --- a/beta/src/content/reference/react-dom/findDOMNode.md +++ b/beta/src/content/reference/react-dom/findDOMNode.md @@ -26,12 +26,6 @@ const domNode = findDOMNode(componentInstance) ### `findDOMNode(componentInstance)` {/*finddomnode*/} - - -This API will be removed in a future major version of React. [See the alternatives.](#alternatives) - - - Call `findDOMNode` to find the browser DOM node for a given React [class component](/reference/react/Component) instance. ```js @@ -65,12 +59,6 @@ const domNode = findDOMNode(componentInstance); ### Finding the root DOM node of a class component {/*finding-the-root-dom-node-of-a-class-component*/} - - -This API will be removed in a future major version of React. [See the alternatives.](#alternatives) - - - Call `findDOMNode` with a [class component](/reference/react/Component) instance (usually, `this`) to find the DOM node it has rendered. ```js {3} diff --git a/beta/src/content/reference/react-dom/hydrate.md b/beta/src/content/reference/react-dom/hydrate.md index 72b561c3..660a1328 100644 --- a/beta/src/content/reference/react-dom/hydrate.md +++ b/beta/src/content/reference/react-dom/hydrate.md @@ -4,10 +4,10 @@ title: hydrate -In React 18, `hydrate` was replaced by [`hydrateRoot`.](/reference/react-dom/client/hydrateRoot) Using `hydrate` in React 18 will warn that your app will behave as if it’s running React 17. Learn more [here.](https://reactjs.org/blog/2022/03/08/react-18-upgrade-guide.html#updates-to-client-rendering-apis) - This API will be removed in a future major version of React. +In React 18, `hydrate` was replaced by [`hydrateRoot`.](/reference/react-dom/client/hydrateRoot) Using `hydrate` in React 18 will warn that your app will behave as if it’s running React 17. Learn more [here.](https://reactjs.org/blog/2022/03/08/react-18-upgrade-guide.html#updates-to-client-rendering-apis) + @@ -28,14 +28,6 @@ hydrate(reactNode, domNode, callback?) ### `hydrate(reactNode, domNode, callback?)` {/*hydrate*/} - - -In React 18, `hydrate` was replaced by [`hydrateRoot`.](/reference/react-dom/client/hydrateRoot) Using `hydrate` in React 18 will warn that your app will behave as if it’s running React 17. Learn more [here.](https://reactjs.org/blog/2022/03/08/react-18-upgrade-guide.html#updates-to-client-rendering-apis) - -This API will be removed in a future major version of React. - - - Call `hydrate` in React 17 and below to “attach” React to existing HTML that was already rendered by React in a server environment. ```js diff --git a/beta/src/content/reference/react-dom/render.md b/beta/src/content/reference/react-dom/render.md index e0f813eb..a91b2a92 100644 --- a/beta/src/content/reference/react-dom/render.md +++ b/beta/src/content/reference/react-dom/render.md @@ -4,10 +4,10 @@ title: render -In React 18, `render` was replaced by [`createRoot`.](/reference/react-dom/client/createRoot) Using `render` in React 18 will warn that your app will behave as if it’s running React 17. Learn more [here.](https://reactjs.org/blog/2022/03/08/react-18-upgrade-guide.html#updates-to-client-rendering-apis) - This API will be removed in a future major version of React. +In React 18, `render` was replaced by [`createRoot`.](/reference/react-dom/client/createRoot) Using `render` in React 18 will warn that your app will behave as if it’s running React 17. Learn more [here.](https://reactjs.org/blog/2022/03/08/react-18-upgrade-guide.html#updates-to-client-rendering-apis) + @@ -28,14 +28,6 @@ render(reactNode, domNode, callback?) ### `render(reactNode, domNode, callback?)` {/*render*/} - - -In React 18, `render` was replaced by [`createRoot`.](/reference/react-dom/client/createRoot) Using `render` in React 18 will warn that your app will behave as if it’s running React 17. Learn more [here.](https://reactjs.org/blog/2022/03/08/react-18-upgrade-guide.html#updates-to-client-rendering-apis) - -This API will be removed in a future major version of React. - - - Call `render` to display a React component inside a browser DOM element. ```js diff --git a/beta/src/content/reference/react-dom/server/renderToNodeStream.md b/beta/src/content/reference/react-dom/server/renderToNodeStream.md index 8da7001b..b4414ad0 100644 --- a/beta/src/content/reference/react-dom/server/renderToNodeStream.md +++ b/beta/src/content/reference/react-dom/server/renderToNodeStream.md @@ -26,12 +26,6 @@ const stream = renderToNodeStream(reactNode) ### `renderToNodeStream(reactNode)` {/*rendertonodestream*/} - - -This API will be removed in a future major version of React. Use [`renderToPipeableStream`](/reference/react-dom/server/renderToPipeableStream) instead. - - - On the server, call `renderToNodeStream` to get a [Node.js Readable Stream](https://nodejs.org/api/stream.html#readable-streams) which you can pipe into the response. ```js @@ -63,12 +57,6 @@ A [Node.js Readable Stream](https://nodejs.org/api/stream.html#readable-streams) ### Rendering a React tree as HTML to a Node.js Readable Stream {/*rendering-a-react-tree-as-html-to-a-nodejs-readable-stream*/} - - -This API will be removed in a future major version of React. Use [`renderToPipeableStream`](/reference/react-dom/server/renderToPipeableStream) instead. - - - Call `renderToNodeStream` to get a [Node.js Readable Stream](https://nodejs.org/api/stream.html#readable-streams) which you can pipe to your server response: ```js {5-6} diff --git a/beta/src/content/reference/react-dom/server/renderToStaticNodeStream.md b/beta/src/content/reference/react-dom/server/renderToStaticNodeStream.md index 6aa7af52..3446aa0f 100644 --- a/beta/src/content/reference/react-dom/server/renderToStaticNodeStream.md +++ b/beta/src/content/reference/react-dom/server/renderToStaticNodeStream.md @@ -47,6 +47,8 @@ A [Node.js Readable Stream](https://nodejs.org/api/stream.html#readable-streams) * The returned stream is a byte stream encoded in utf-8. If you need a stream in another encoding, take a look at a project like [iconv-lite](https://www.npmjs.com/package/iconv-lite), which provides transform streams for transcoding text. +--- + ## Usage {/*usage*/} ### Rendering a React tree as static HTML to a Node.js Readable Stream {/*rendering-a-react-tree-as-static-html-to-a-nodejs-readable-stream*/} @@ -72,6 +74,3 @@ This method renders **non-interactive HTML that cannot be hydrated.** This is us Interactive apps should use [`renderToPipeableStream`](/reference/react-dom/server/renderToPipeableStream) on the server and [`hydrateRoot`](/reference/react-dom/client/hydrateRoot) on the client. - ---- - diff --git a/beta/src/content/reference/react-dom/unmountComponentAtNode.md b/beta/src/content/reference/react-dom/unmountComponentAtNode.md index 40f8db19..7fbb7648 100644 --- a/beta/src/content/reference/react-dom/unmountComponentAtNode.md +++ b/beta/src/content/reference/react-dom/unmountComponentAtNode.md @@ -4,10 +4,10 @@ title: unmountComponentAtNode -In React 18, `unmountComponentAtNode` was replaced by [`root.unmount()`](/reference/react-dom/client/createRoot#root-unmount). - This API will be removed in a future major version of React. +In React 18, `unmountComponentAtNode` was replaced by [`root.unmount()`](/reference/react-dom/client/createRoot#root-unmount). + @@ -28,14 +28,6 @@ unmountComponentAtNode(domNode) ### `unmountComponentAtNode(domNode)` {/*unmountcomponentatnode*/} - - -In React 18, `unmountComponentAtNode` was replaced by [`root.unmount()`](/reference/react-dom/client/createRoot#root-unmount). - -This API will be removed in a future major version of React. - - - Call `unmountComponentAtNode` to remove a mounted React component from the DOM and clean up its event handlers and state. ```js diff --git a/beta/src/content/reference/react/Component.md b/beta/src/content/reference/react/Component.md index 51bd6528..3063a050 100644 --- a/beta/src/content/reference/react/Component.md +++ b/beta/src/content/reference/react/Component.md @@ -28,12 +28,6 @@ class Greeting extends Component { ## Reference {/*reference*/} - - -We recommend to define components as functions instead of classes. [See how to migrate.](#alternatives) - - - ### `Component` {/*component*/} To define a React component as a class, extend the built-in `Component` class and define a [`render` method:](#render) diff --git a/beta/src/content/reference/react/createFactory.md b/beta/src/content/reference/react/createFactory.md index c984564e..a5ddc177 100644 --- a/beta/src/content/reference/react/createFactory.md +++ b/beta/src/content/reference/react/createFactory.md @@ -26,12 +26,6 @@ const factory = createFactory(type) ### `createFactory(type)` {/*createfactory*/} - - -This API will be removed in a future major version of React. [See the alternatives.](#alternatives) - - - Call `createFactory(type)` to create a factory function which produces React elements of a given `type`. ```js @@ -66,12 +60,6 @@ Returns a factory function. That factory function receives a `props` object as t ### Creating React elements with a factory {/*creating-react-elements-with-a-factory*/} - - -This API will be removed in a future major version of React. [See the alternatives.](#alternatives) - - - Although most React projects use [JSX](/learn/writing-markup-with-jsx) to describe the user interface, JSX is not required. In the past, `createFactory` used to be one of the ways you could describe the user interface without JSX. Call `createFactory` to create a *factory function* for a specific element type like `'button'`: diff --git a/beta/src/content/reference/react/createRef.md b/beta/src/content/reference/react/createRef.md index ce2e7799..b9e85bd3 100644 --- a/beta/src/content/reference/react/createRef.md +++ b/beta/src/content/reference/react/createRef.md @@ -40,12 +40,6 @@ class MyComponent extends Component { // ... ``` - - -`createRef` is mostly used for [class components.](/reference/react/Component) Function components typically rely on [`useRef`](/reference/react/useRef) instead. - - - #### Parameters {/*parameters*/} `createRef` takes no parameters. diff --git a/beta/src/content/reference/react/useInsertionEffect.md b/beta/src/content/reference/react/useInsertionEffect.md index fad1aaec..7930479d 100644 --- a/beta/src/content/reference/react/useInsertionEffect.md +++ b/beta/src/content/reference/react/useInsertionEffect.md @@ -26,12 +26,6 @@ useInsertionEffect(setup, dependencies?) ### `useInsertionEffect(setup, dependencies?)` {/*useinsertioneffect*/} - - -`useInsertionEffect` is aimed at CSS-in-JS library authors. Unless you are working on a CSS-in-JS library and need a place to inject the styles, you probably want [`useEffect`](/reference/react/useEffect) or [`useLayoutEffect`](/reference/react/useLayoutEffect) instead. - - - Call `useInsertionEffect` to insert the styles before any DOM mutations: ```js