不能将状态传递给条件？

Question

正在开发一个可以 post 视频游戏剪辑的应用程序。有两个剪辑数据提取是同一件事，只是在后端以两种不同的方式排序（默认和大多数评论）。尝试有条件地呈现提取。当我将第 4 行更改为 switchFetches === true 时似乎有效。但是当我按下将 switchFetches 更改为 false.

的按钮时却没有

应用程序

const [switchFetches, setSwitchFetches] = useState(true);

  useEffect(() => {
    if (switchFetches === false) {
      fetch("/most_comments")
        .then((r) => r.json())
        .then((data) => setClipData(data));
    } else {
        fetch("/clips")
        .then((r) => r.json())
        .then((data) => setClipData(data));  
    }
  }, []);

剪辑列表

function onChangeForFilter(e) {
    e.preventDefault();
    setSwitchFetches(false)
  }

Answer 1

你的 useEffect 将执行一次，因为它有空的依赖数组。添加 switchFetches 以使其在 switchFetches 更改时再次执行。

const [switchFetches, setSwitchFetches] = useState(true);

  useEffect(() => {
    if (switchFetches === false) {
      fetch("/most_comments")
        .then((r) => r.json())
        .then((data) => setClipData(data));
    } else {
        fetch("/clips")
        .then((r) => r.json())
        .then((data) => setClipData(data));  
    }
  }, [switchFetches]);

不能将状态传递给条件？

Cant pass state to a conditional?

javascript

conditional-statements

reactjs

use-state