React-IMask 7.6.0版本中setTypedValue的使用注意事项

在React-IMask 7.6.0版本中，开发者需要注意setTypedValue方法的使用方式发生了变化。这个变化主要影响了通过外部控制输入字段值的场景。

问题背景

React-IMask是一个流行的React输入掩码库，它提供了强大的格式化输入功能。在7.6.0版本之前，开发者可以同时使用value属性和useIMask钩子来控制输入值。然而，这种用法在7.6.0版本中不再被推荐。

关键变化

7.6.0版本引入了一个新的属性defaultTypedValue，它专门用于通过外部控制输入值。这个变化意味着：

1. 当使用useIMask钩子时，不应该再显式地在输入元素上设置value属性
2. 应该使用defaultTypedValue来替代直接设置value

正确用法示例

const { ref } = useIMask({
  mask: Number,
  scale: 2,
  thousandsSeparator: ",",
  radix: ".",
  mapToRadix: [""],
  min: -100000000000,
  max: 100000000000,
  defaultTypedValue: value // 使用defaultTypedValue而不是value
});

return <input ref={ref} />;

为什么需要这个改变

这个改变是为了更好地分离关注点：

1. useIMask钩子现在完全负责管理输入值状态
2. 外部控制通过defaultTypedValue属性实现，而不是直接操作DOM
3. 这种模式更符合React的受控组件最佳实践

迁移建议

对于正在从7.5.0或更早版本升级到7.6.0的开发者：

1. 检查所有使用useIMask钩子的地方
2. 移除输入元素上的value属性
3. 使用defaultTypedValue属性来设置初始值或外部控制的值

这个改变虽然需要一些代码调整，但它提供了更清晰、更React式的API设计，长期来看将提高代码的可维护性。