可以通过在挂载上发出请求来调用重新渲染吗?还是需要useEffect?(也许懒惰模式不同于普通查询?)

export const Catalog: React.FC<CatalogProps> = ({ object, category }) => {
  const [getCatalogProducts, result] = useLazyGetCatalogProductsQuery();
  const { data, isUninitialized } = result;

  const request = `object_like=${object}&category=${category}`;

  if (isUninitialized) {
    getCatalogProducts(request);
  }

  if (!data) return;

  return (
    // some jsx code
  );
};

推荐答案

可以通过在挂载上发出请求来调用重新渲染吗?

是的,当组件安装时,几乎可以做任何事情.

还是需要useEffect个?

是的,当组件安装时,您应该使用useEffect挂钩来发出副作用.

export const Catalog = ({ object, category }: CatalogProps) => {
  const [
    getCatalogProducts,
    { data, isUninitialized }
  ] = useLazyGetCatalogProductsQuery();

  useEffect(() => {
    const request = `object_like=${object}&category=${category}`;

    if (isUninitialized) {
      getCatalogProducts(request);
    }
  }, []); // <-- empty dependency array, run once after initial render cycle

  if (!data) return;

  return (
    // some jsx code
  );
};

也许懒惰模式不同于普通查询?

是的,当然是这样.主要区别在于,常规查询是自动触发的,而懒惰查询不是.通常情况下,您将使用常规查询,因为"懒惰"查询更像是一种"按需"情况,例如,用户单击一个按钮,而您想要运行查询.当组件装载时,常规查询也将被初始化.

您可以查看这Hooks Overview项,以获得有关差异的完整概述.

enter image description here

Typescript相关问答推荐

用泛型类型覆盖父类函数导致类型y中的Property x不能赋给基类型Parent中的相同属性."'''''' "

未在DIST中正确编译TypeScrip src模块导入

打印脚本中的动态函数重载

如何重构长联合类型?

在Reaction-Native-ReAnimated中不存在Animated.Value

一个打字类型可以实现一个接口吗?

ANGLING v17 CLI默认设置为独立:延迟加载是否仍需要@NgModule进行路由?

使用Redux Saga操作通道对操作进行排序不起作用

AngularJS服务不会解析传入的Json响应到管道中的模型

TypeScrip泛型类未提供预期的类型错误

如何缩小函数的返回类型?

类型';字符串|数字';不可分配给类型';未定义';.类型';字符串';不可分配给类型';未定义';

如何按属性或数字数组汇总对象数组

将接口映射到交叉口类型

递归生成常量树形 struct 的键控类型

仅当类型为联合类型时映射属性类型

如何填写Partial的一些属性并让类型系统知道它?

如何通过nx找到所有受影响的项目?

带有 Select 器和映射器的Typescript 泛型

当受其他参数限制时,通用参数类型不会缩小