如何在React Native中创建表单？单useState还是react-hook-form更优？

两种原生状态管理方案的对比 #

两种写法都是完全合法的React写法，没有绝对的对错，只看是否适配你的场景：

• 每个字段单独声明useState()
  这种写法逻辑最直观，每个字段的状态更新完全独立，不存在状态合并的遗漏问题，新手使用不容易出bug。缺点是当表单字段数量较多时，状态声明代码会比较冗余。
• 单个useState()存表单对象
  就是你补充的写法，完全可以正常运行，代码更简洁，字段扩展成本更低。唯一要注意更新时必须先拷贝原有对象再修改对应字段，避免覆盖其他属性，更新的标准写法如下：

  setRegisterForm(prev => ({
    ...prev,
    [targetFieldName]: newValue
  }))
  

  如果漏写...prev展开原有对象，会导致其他未修改的字段值丢失。

要不要引入第三方表单库 #

这个完全取决于你的表单复杂度：

• 如果你的注册表单仅包含当前这几个字段，没有复杂的格式校验、字段联动、错误提示、提交防抖等需求，完全不需要引入额外的第三方库，上面两种原生方案足够覆盖需求，还能避免额外的包体积开销。
• 如果你后续需要扩展表单能力，比如要做密码强度校验、手机号格式校验、提交状态管理、减少不必要的组件重渲染，那么用成熟的第三方表单库会大幅减少你需要手写的样板代码，也能规避很多手动处理表单容易踩的坑。

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