Mini-react 思路react 是什么先来聊聊，这是个什么案例1 页面显示一个按钮，点击后页面count变量加

react 是什么

先来聊聊，这是个什么

案例1

页面显示一个按钮，点击后页面count变量加1

<html>
    <head>
        <title>Test</title>
    </head>
    <body>
        <div id="root">
            <div id="content" onclick="changeText()">Click Me, Count: 0</div>
        </div>
    </body>
    <style>
        #content{
            font-size:22px;
            border: 1px solid gray;
            cursor: pointer;
            padding: 6px 10px;
            display: inline-block;
            border-radius: 10px;
        }
    </style>
    <script lang="javascript">
        let count = 0
        function changeText(){
            count ++
            document.getElementById('content').innerText = "Click Me, Count: " + count
        }
    </script>
</html>

  <script type="text/babel">
      function MyFunctionComponent() {
        let [count, setCount] = React.useState(0)
        return <div id="content" onClick={()=>setCount(++count)}>Click Me, Count: {count}</div>
      }

      const container = document.getElementById('root');
      const root = ReactDOM.createRoot(container);
      root.render(<MyFunctionComponent />);

    </script>