【问题标题】:React Context for event为事件反应上下文
【发布时间】:2020-02-28 15:49:48
【问题描述】:

我有以下上下文:

import React from 'react';
import { createContext } from "react";

type UserModifcationContextType = {
  onEdit?: (objectId: number) => void;
  onDelete?: (objectId: number) => void;
};

export const UserModificationContext = createContext<UserModifcationContextType>({
  onDelete: undefined,
  onEdit: undefined
});


export const UserModificationContextProvider: React.FC<UserModifcationContextType> = ({
  onDelete,
  onEdit
}) => {
  return (<UserModificationContext.Provider value={{ onDelete, onEdit }
  } />
  );
}

我使用它的原因是因为当许多深度嵌套的子组件之一修改用户时,我需要刷新父组件中的用户数据。例如,用户可以通过右键单击并从自定义右键单击菜单中选择“删除用户”来删除另一个用户,或者他们可以单击删除按钮。 问题是自定义右键单击菜单的父级还需要侦听删除,以便自定义右键单击菜单在删除时关闭。我的问题是我应该将事件发射器存储在自定义上下文中还是有其他我没有考虑过的方式。

【问题讨论】:

    标签: reactjs react-context


    【解决方案1】:

    是的,您可以将函数存储在上下文中。如果对您的函数的引用在初始化后从未改变,您也可以将其导出/导入到您想要的任何组件中。

    【讨论】:

      猜你喜欢
      • 2019-06-10
      • 1970-01-01
      • 2019-03-31
      • 2015-02-21
      • 2020-01-01
      • 1970-01-01
      • 2017-04-12
      • 1970-01-01
      • 2021-08-01
      相关资源
      最近更新 更多