interesting-practice/react-hooks-v2.html at master · iamwjun/interesting-practice · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>React-Hooks</title>
</head>

<body>
  <div class="count"></div>
  <div class="slot"></div>
</body>
<script>
  let index = 0;
  const cache = [];

  function useState(initialState) {
    let state = cache[index] || initialState;
    const _index = index;

    const setState = (newState) => {
      cache[_index] = newState;
      render();
    }

    index++;

    return [cache[_index] || state, setState];
  }

  const [count, setCount] = useState(1);
  const [slot, setSlot] = useState(2);

  function render() {
    var dq01 = document.querySelector('.count');
    var dq02 = document.querySelector('.slot');
    dq01.innerHTML = count;
    dq02.innerHTML = slot;
  }

  render();
</script>

</html>