问根据React状态为html选择器添加CSS？

EN

...
render() {
  let html = document.querySelector('html');
  this.state.test === "test" ? html.style.overflowY = "hidden" : html.style.overflowY = "visible";
  return (
   ....
  )
};

function MyComponent() {
    // Set your state somehow
    const [something, setSomething] = useState(initialState)
    // Use it in your className`
    return <div className={!!something && 'class-name'} />
}

import cx from 'classnames'


function MyComponent() {
    const [something, setSomething] = useState(initialState)

    return <div className={cx({
        'some-class' : something // if this is truthy, 'some-class' gets applie
    })} />
}

function App() {
  const [visible, setVisible] = useState(false);

  useEffect(() => {
    const htmlSelector = document.querySelector("html");
    htmlSelector.style.overflowY = visible ? "unset" : "hidden";
  }, [visible]);

  return (
    <button onClick={() => setVisible(prevState => !prevState)}>
      Toggle overflow
    </button>
  );
}