v0.5.3

v0.5.3 (March 26, 2019)

• 🙏修复$formutil.$setValues()某些情况下导致设置的非nested的值混入到$params中的问题。
• 🤘调整TS类型声明，Field的值声明为any时不再默认转换为string。

v0.5.2

v0.5.2 (March 25, 2019)

• 🙏修复<Form />的$onFormChange()和$validator()属性回调，在Field挂载(mount)/销毁(unmount)时，其参数传递的$formutil不是最新的问题。
  • 该问题的原因是，从0.5.0起，我们是在Field的didMount后去注册自身的，此时Form还在当前渲染周期中的commit阶段（还没有触发Form的didUpdate，但是已经过了其reconciler阶段）。
  • 因为是在reconciler阶段后，把变化的值推入队列的，所以当Form的commit阶段后触发的didUpdate生命周期中，我们根据队列中存储的变化的Field调用$onFormChange回调，拿到的并不是最新的包含了当前帧注册的Field。
  • 通过故意延迟一帧再调用来修复该问题，该方法同时也优化了大量Field变化时，回调过于频繁的问题。
• 🙏修复<Form />的$onFormChange()应该在$validator校验调用之后触发。
• 🤘调整<Field /> <EasyField />的TS类型声明。仅仅内部调整优化，不影响使用。

v0.5.1

v0.5.1 (March 20, 2019)

• 👉新增$formutil.$onValidates()，监听Form当前校验是否完成。
• 👉新增$fieldutil.$onValidate()，监听当前Field校验是否完成。
• 👉<Field />新增$reserveOnUnmount属性，用来设置是否在Field组件unmount时一并销毁状态。

v0.5.0

v0.5.0 (March 19, 2019)

👏经过将近一个月的开发迭代，我们终于发布了里程碑式的v0.5.0版本。

与v0.4.x版本相比，v0.5.0在保持API稳定的前提下，对于react@16乃至未来开启异步渲染的react@17都保持了很好的支持，同时也新增了对于Hooks的支持。但是，v0.5.0也同样向下兼容react@15版本，所以如果你还在使用v0.4.x版本，并且没有升级项目中react版本的计划，你依然可以更新到最新的v0.5.0!!

Installation

# npm
npm install react-formutil@latest --save

# yarn
yarn install react-formutil@latest

BREAK CHANGE

如果你在使用上一版本，0.5.0的一些变动可能会造成一些兼容错误，整理了下，可以参考以应对可能出现的错误：

$getField()遇到TSC报告类型错误

这是由于$getField()的返回值被声明为undefined | $Fieldutil导致的。你可以参考下方<Form />组件的更新说明，关于类型声明变化所给出的解决办法。

Warning: The second parameter(xxx) of parsePath() must be a string. OR Uncaught TypeError: path.match is not a function

这种一般是由于调用的方法被传递了错误的参数值。极有可能出现的一种情况是，调用$formutil.$validates()时：

// error
<Field name="username" $onFieldChange={this.props.$formutil.$validates} />

0.5.0中的$formutil.$validates()可以接受一些参数了，而$onFieldChange回调会传递Field的新值、旧值，这会导致$validates内部在解析这些参数时遇到错误。所以如果要对所有表单项进行校验，应当修改为：

// good
<Field name="username" $onFieldChange={() => this.props.$formutil.$validates()} />

$parser和$formatter可能没有按照预期运行

这是因为0.5.0起，区分了$value和$viewValue，相应的$parser和$formatter的行为也略作调整。大多数情况下，这没有什么影响。如果有与预期不一致的情形，请根据最新文档更新$parser和$formatter的使用。

CHANGE LOG

👉新增 是指增加了新的组件属性配置、新的访问调用API等。这些变动不影响之前版本。
💪增强 是指，在之前版本的API基础上，增加了新的调用或者传值方式，但是原本的调用方式保持不变，所以同样不影响之前版本使用。
🤘调整 是指与之前版本相比，有一定的API变化，如果有用到，可能需要在升级时特别注意。

All

• 移除react@16.3开始deprecated的组件生命周期👏
• 替换使用新版本的context API👏
• 部分API增加错误调用警告⚠️

<Form />

• 👉新增$processer属性，用来做Form-Level的状态修改。
• 👉新增$validator属性，用来做Form-Level的校验。支持同步和异步模式。
• 👉新增$formutil.$onValidates()，用于确保当前表单所有校验已执行完毕。注：该方法并不会触发校验，如果要触发表单校验，请使用$formutil.$validates()。From v0.5.1
• 💪增强$formutil.$validates()，现在可以对全部、指定name的Field触发校验；运行校验全部Field还会触发Form的$validator校验。
• 🤘调整$getField() $validate()的TS类型声明，这两个方法如果指定的name参数所对应的Field没有注册或者已经取消注册，将会返回undefined。你可以通过下面两种办法，来略调整代码以兼容新的类型声明：
  • 使用非空类型断言(Non-null assertion operator)调整报错的代码：this.props.$formutil.$getField('some_name')!.$validate()
  • 使用非空类型保护(Non-null and non-undefined type guards)来调整报错代码：const handler = this.props.$formutil.$getField('phone'); handler && handler.$validate();
• 💪增强$formutil的所有更新状态方法，现在都将返回Promise，并且传递渲染完成后的新的$formutil对象；回调方法中也会传递渲染完成后的新的$formutil对象。
• 🤘调整$formutil的TS类型声明，所有属性都被标记为readonly。

<Field />

• 👉新增$viewValue状态，用来表示视图值。现在模型值$value和视图值$viewValue将分开保存。
• 👉新增$validateLazy属性，用来控制是否启用懒校验模式。
• 👉新增$reserveOnUnmount属性，用来控制是否在Field组件销毁时，将其一并从Form控制器中移除（默认情况是移除，你可以通过该属性设置为true来保留该Field状态）；下次该组件恢复时，会继承之前的所有状态，完全恢复如初！！From v0.5.1
• 🤘更新$parser和$formatter的影响范围，两者将只会单向调用，即$parser只影响$viewValue => $value，$formatter反之。
• 💪增强异步校验逻辑：连续触发的异步校验，都会采用最后一次校验的结果（前面触发的调用结果会被忽略，但是不会自动取消，如果有必要，需要自己实现取消逻辑，例如abort网络请求）
• 🤘调整Field注册由之前的组件constructor实例化时，改为组件挂载DOMcomponentDidMount后。
  • 这是为了更好兼容未来Fiber开启异步后，组件mount前，都有可能被打断，避免重复注册，或者无法取消注册。
  • 在绝大多数情况下，这个改动对于使用都没有任何影响。如果你有在表单初始化时就访问Field实例，那么可能需要将这个逻辑改到表单组件的compoenntDidMount后运行。
• 👉新增$fieldutil.$onValidate()，用于确保当前Field的校验已执行完毕。注：该方法并不会触发校验，如果要触发Field的校验，请使用$fieldutil.$validate()。From v0.5.1
• 💪增强$fieldutil.$validate()，现在该方法传递回调函数将支持异步校验后回调（之前总是同步模校验完成后即回调）；并且该校验方法调用时，如果遇到异步校验被打断（值被更新，再次触发校验），回调方法会延迟到新的校验完成后调用（之前版本不会执行被打断的校验回调），并且会保持调用顺序！
• 💪增强$fieldutil的所有更新状态方法，现在都将返回Promise，并且传递渲染完成后的新的$fieldutil对象；回调方法中也会传递渲染完成后的新的$fieldutil对象。
• 🤘调整$fieldutil的TS类型声明，所有属性都被标记为readonly。

<EasyField />

• 💪重构EasyField实现

Hooks

参考Hooks

• 👉新增useField
• 👉新增useHandler
• 👉新增useForm

v0.5.0-beta.19

• See 0.5.0

v0.5.0-beta.18

• add $validator on <Form />

v0.5.0-beta.16

• add useHandler hook.
• refactor EasyField

v0.5.0-beta.11

• fix(Field): return a shallow copy of $state in $getState()

v0.5.0-beta.10

• feat(Form): add $processer to process the every $state

v0.5.0-beta.7

chore: release v0.5.0-beta.7