React的主要内容

Hooks

// 复用逻辑的自定义 Hook
function useLocalStorage(key, initialValue) {
  const [value, setValue] = useState(() => {
    const stored = localStorage.getItem(key);
    return stored ? JSON.parse(stored) : initialValue;
  });
  
  useEffect(() => {
    localStorage.setItem(key, JSON.stringify(value));
  }, [key, value]);
  
  return [value, setValue];
}

函数组件

// 使用 Hooks 的函数组件
function MyComponent(props) {
  const [state, setState] = useState(initialState);
  return <div>Hello {props.name}</div>;
}

// 箭头函数写法
const MyComponent = (props) => {
  return <div>Hello {props.name}</div>;
};