docs: 修复 ReactDOM 引入错误的问题

[demigodliu]

Checklist

• npm test passes
• tests and/or benchmarks are included
• commit message follows commit guidelines

Description of change

Fix: incorrect ReactDOM import path in example code.

The previous example mistakenly imported ReactDOM from react, which caused
runtime errors since the React default export does not provide render or
createRoot. This update changes the import to react-dom/client, aligning
with the React 18 API and ensuring the example runs correctly.

[gemini-code-assist]

Summary of Changes

Hello @demigodliu, I'm Gemini Code Assist¹! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request addresses a critical issue in the React framework tutorial documentation where an example failed to execute due to an incorrect ReactDOM import. The change updates the import path to react-dom/client, making the example compatible with React 18's new client-side rendering API and ensuring the documentation provides functional code snippets for users.

Highlights

• Documentation Fix: Corrected an erroneous ReactDOM import path within the React framework tutorial documentation.
• React 18 Compatibility: Updated the import statement from import ReactDOM from 'react' to import ReactDOM from 'react-dom/client' to align with React 18's client-side rendering API.
• Example Functionality: Resolved runtime errors in the example code, ensuring it now runs correctly as intended.

Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature	Command	Description
Code Review	/gemini review	Performs a code review for the current pull request in its current state.
Pull Request Summary	/gemini summary	Provides a summary of the current pull request in its current state.
Comment	@gemini-code-assist	Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help	/gemini help	Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Footnotes

1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩

[gemini-code-assist]

Code Review

此 PR 修复了文档中一个错误的 ReactDOM 导入。但新的导入 react-dom/client 也不正确，因为它没有默认导出，与代码中使用的 ReactDOM.render API 不兼容，会导致运行时错误。我已提供建议，将导入更改为 react-dom 以修复此问题，这也与项目依赖的 React 版本一致。