react-10 函数式写法rsc，配合HOOKS钩子函数
warning:
这篇文章距离上次修改已过192天，其中的内容可能已经有所变动。
React 10函数式写法和HOOKS的结合使用，可以使代码更为简洁和功能化。以下是一个简单的React函数式组件的例子，它使用了useState钩子来管理组件的状态，并用useEffect钩子处理副作用。
import React, { useState, useEffect } from 'react';
function MyComponent() {
const [count, setCount] = useState(0);
useEffect(() => {
// 假设这里是一个副作用，比如设置文档的标题
document.title = `You clicked ${count} times`;
});
return (
<div>
<p>You clicked {count} times</p>
<button onClick={() => setCount(count + 1)}>Click me</button>
</div>
);
}
export default MyComponent;这个组件是一个计数器，当用户点击按钮时，计数器会增加，同时我们用useEffect更新了文档的标题。这个例子展示了如何使用函数式组件和React的hooks API来管理状态和进行有状态的操作。
评论已关闭