Akira1ce

React 中组件式条件渲染，不再通过 js 表达式去做条件判断，代码组织结构更加清晰。

预览

index.tsx

components/show.tsx

'use client';
 
import { useState } from 'react';
import Show from './components/show';
 
const Index = () => {
  const [show, setShow] = useState(false);
 
  return (
    <>
      <button className="cursor-pointer" onClick={() => setShow(!show)}>
        Click me!
      </button>
      <Show when={show}>
        <div>我来</div>
      </Show>
    </>
  );
};
 
export default Index;