如何在按钮上单击React时更改光标图标

Question

当我单击按钮时，如何将光标更改为图标，然后再次单击将该图标放下，然后再次成为常规光标？我在React中工作。我所拥有的就是，当单击“我”按钮时，单击的全局布尔值将变为true。

Answer 1

这对您所需要的有用吗？

const [cursor, setCursor] = useState('crosshair');


  const changeCursor = () => {
    setCursor(prevState => {
      if(prevState === 'crosshair'){
        return 'pointer';
      }
      return 'crosshair';
    });
  }

  return (
    <div className="App" style={{ cursor: cursor }}>

      <h2>Click to change mouse cursor</h2>
      <input  type="button" value="Change cursor" 
      onClick={changeCursor}
      style={{ cursor: cursor }}

      />
    </div>
  );