React hook useRef 是 React 中的一个重要概念，它用于在函数组件中保存和访问变量的引用。然而，有些情况下，我们需要注意不要滥用 useRef。具体来说，useRef 不适用于样式组件和打字稿。

jsx
import React, { useState } from 'react';
const Counter = () => {
  const [count, setCount] = useState(0);
  const increment = () => {
    setCount(prevCount => prevCount + 1);
  };
  const buttonStyle = {
    backgroundColor: count % 2 === 0 ? 'green' : 'blue',
    color: 'white',
    padding: '10px',
    borderRadius: '5px',
    cursor: 'pointer',
  };
  return (
    
      
Counter: {count}
      
        Increment
      
    
  );
};
export default Counter;

tsx
import React, { useState } from 'react';
type CounterProps = {
  initialValue: number;
};
const Counter: React.FC = ({ initialValue }) => {
  const [count, setCount] = useState(initialValue);
  const increment = () => {
    setCount(prevCount => prevCount + 1);
  };
  return (
    
      
Counter: {count}
      Increment
    
  );
};
export default Counter;