Ngrx中createAction的props<>()方法能否为属性设置默认值？

你好呀！确实，直接在props<>()的泛型类型里加默认值是行不通的，因为props<>()的作用只是定义Action payload的类型结构，它不负责处理实际的默认值逻辑——你之前写的{ value = 0 }是JavaScript的对象默认值语法，但这里是TypeScript的类型定义区域，所以TS会把<符号当成比较运算符，才抛出了那个奇怪的错误。

那该怎么给Action的属性加默认值呢？其实Ngrx的createAction支持另一种写法：用工厂函数来返回payload，这样就能轻松设置默认值了，举两个常见的实现方式：

方式1：直接在工厂函数里设置默认值 #

export const set = createAction(
  '[Counter] Set',
  // 这里给参数value设置默认值0，返回对应的payload对象
  (value: number = 0) => ({ payload: { value } })
);

调用的时候就可以灵活选择：

• 不传参数：store.dispatch(set()) → payload里的value就是0
• 传具体值：store.dispatch(set(5)) → payload里的value是5

方式2：结合类型定义+工厂函数 #

如果你想先明确payload的类型（和原来用props<>()的习惯保持一致），可以先定义类型，再在工厂函数里用：

// 先定义payload的类型
type SetCounterProps = { value: number };

export const set = createAction(
  '[Counter] Set',
  // 给props参数设置默认值对象
  (props: SetCounterProps = { value: 0 }) => props
);

这种写法调用起来也一样：

• store.dispatch(set()) → 自动使用默认的{ value: 0 }作为payload
• store.dispatch({ value: 3 }) → 传入自定义的payload

总结一下：props<>()只负责类型约束，默认值要通过createAction的第二个参数（工厂函数）来实现，这样既符合Ngrx的规范，又能满足你的需求～

备注：内容来源于stack exchange，提问作者Jagrit Goyal