问在反应中使用服务的最佳方式是什么？
EN

Stack Overflow用户

提问于 2022-07-25 08:54:07

回答 1查看 64关注 0票数 0

由于在React中引入了钩子，React是函数式编程。但有时需要一个“服务”-like对象来解决某些特性。即：

function MyComponente() {
  const cache = useCache({ name: "my-component" });

  console.log(cache.getSelectedItem());
  console.log(cache.setSelectedItem(5));
  // ....

  return <Items cache={cache} />;
}

在上面的代码中，"service"-like对象是cache。在这里，cache实例是用“钩子”-approach创建的。代码可以如下所示：

import { cacheRegister, defaultFilters } from "../reactive-vars";

const useCache = ({name}) => {
  const initialState = cacheRegister[name]();
  const currentState = cacheRegister[name];

  return useRef({
    getName: () => name,
    getSelectedItem: () => cacheRegister[name].selectedItem,
    setSelectedItem: (item) => cacheRegister[name]({ ...cacheRegister[name], selectedItem: item }),
    // ....
  });
}

这是最好的办法吗？useRef避免了缓存实例的重新生成，保持了缓存引用的稳定性.

functional-programming

service-object

reactjs

回答 1

Stack Overflow用户

回答已采纳

发布于 2022-07-25 09:01:45

我肯定会和useRef一起去。这就是我在我的反应项目中使用服务的方式。正如您所提到的，ref是一个稳定的包装器，由于服务应该是一次性实例化的，而不依赖于某些外部状态，所以useRef使其更适合使用。我只是喜欢用JS类定义服务，然后将它与类似于：const service = useRef(new SomeService(...someParams))的东西一起使用；

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/73106438

复制

相似问题

问在反应中使用服务的最佳方式是什么？
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在反应中使用服务的最佳方式是什么？EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在反应中使用服务的最佳方式是什么？
EN