javascript - React useState 是如何工作的？vanila js怎么可能呢？

Question

想了解一下，如何用纯js搭建。我希望它是这样的：

const useStatePureJs = () => {
  let state = null;
  
  const setState = (value) => {
    state = value
  };

  return [
    state,
    setState
  ];
};

const [state, setState] = useStatePureJs();

setState(5);

console.log(state);

但是由于范围初始化，我的 console.log 将返回 null。如何使用纯 js 实现对其进行更新？我的意思是价值。我需要一个观察者还是什么？

标签： javascriptreactjsreact-hooks

Answer 1

那这个呢？似乎可以按您的预期工作。

const useStatePureJs = () => {
  let state;
  const getState = () => {
    return state
  }
  const setState = (x) => {
    state = x
  }
  return [ getState, setState ]
}

const [ getState, setState ] = useStatePureJs()
setState(1)
console.log(getState()) // 1
setState(2)
console.log(getState()) // 2