React+Redux+TypeScript单元测试void函数属性传参问题

首先明确：你定义的Props（注意你代码里写的Pros是拼写错误）中closeForm是必填的、无入参、返回值为void的函数类型，传入null是不符合类型要求的，会触发TS类型报错，且如果组件内部调用了该方法，运行时会直接抛出closeForm is not a function的异常。

根据你的测试场景，有两种标准传值方式：

• 场景1：仅需要满足类型校验，不需要验证该函数的调用逻辑
  直接传入一个空的箭头函数即可，完全匹配类型定义，调用时不会产生副作用也不会报错：

  const testProps = {
    studentid: "123",
    pageId: "123",
    closeForm: () => {} // 空函数，符合() => void的类型要求
  }
  

  注意：你原来写的对象属性之间缺少逗号，属于JS语法错误，编写时需要补上。

• 场景2：需要验证组件是否正确触发了closeForm方法（比如点击关闭按钮的交互测试）
  传入测试框架提供的mock函数即可，既满足类型要求，还可以后续断言函数的调用次数、入参等逻辑。以主流测试框架为例：
  如果使用Jest：

  const mockCloseForm = jest.fn(); // 构造mock空函数
  const testProps = {
    studentid: "123",
    pageId: "123",
    closeForm: mockCloseForm
  }
  
  // 测试断言示例：触发关闭操作后验证函数被正确调用
  // fireEvent.click(screen.getByText('关闭'));
  // expect(mockCloseForm).toHaveBeenCalledTimes(1);
  

  如果使用Vitest，只需要把jest.fn()替换为vi.fn()即可，用法完全一致。

补充说明：不要给这类必填的函数类型属性传null/undefined，除非你在类型定义里明确给它加上| null的类型标注，否则既过不了TS校验，也容易引发运行时错误。

内容的提问来源于stack exchange，提问作者TechEntousiast