为什么我总是需要用 ZustandReact-Redux 状态管理工具Store 返回一些 html？

如何解决为什么我总是需要用 ZustandReact-Redux 状态管理工具Store 返回一些 html？

为什么“inc”按钮不起作用，而其他按钮起作用？我是不是遗漏了什么，还是 Zustand 商店应该以这种方式工作？

我正在尝试呈现的页面

import React from "react";
// import store from "./store";
import { useStore } from "./zustandStore/store";

export default function App() {
  const Addamodel = () => {
    const inc = useStore((state) => state.bears);
    console.log(inc);
  };

  function BearCounter() {
    const bears = useStore((state) => state.bears);
    return <h1>{bears} around here ...</h1>;
  }

  function Controls() {
    const increasePopulation = useStore((state) => state.increasePopulation);
    return <button onClick={increasePopulation}>one up</button>;
  }

  return (
    <div>
      APP
      <div>
        <button onCLick={Addamodel}>inc</button>
        {Controls()}
        {BearCounter()}
      </div>
    </div>
  );
}

商店

import create from "zustand";
import { devtools } from "zustand/middleware";

let store = (set) => ({
  bears: 0,increasePopulation: () => set((state) => ({ bears: state.bears + 1 })),removeAllBears: () => set({ bears: 0 }),});

store = devtools(store);

export const useStore = create(store);

这里是 Zustand 状态管理工具的链接： https://github.com/pmndrs/zustand