react记录

1.ref的使用（表单重置的使用）

const formRef = React.createRef()
const handleClick = () => {
  const fields = formRef.current.getFieldsValue()
    for (let item in fields) {
      if ({}.hasOwnProperty.call(fields, item)) {
        if (fields[item] instanceof Array) {
          fields[item] = []
        } else {
          fields[item] = undefined
        }
      }
    }
    formRef.current.setFieldsValue(fields)
}

<Form
   ref={formRef}
    onFinish={onFinish}
    initialValues={{ status: null }}>
    ...
</Form>    
<Button type="primary" onClick={handleClick} style={{ marginLeft: 80 }}>
    重置
</Button>

2.react 中useEffect 的使用

Vue中有类似于React中useEffect的功能。在Vue 3中，可以使用watchEffect函数实现类似于useEffect的功能。watchEffect会自动追踪其依赖项，一旦其中任何一个发生变化，就会重新运行函数体。

在Vue 2中，可以使用computed属性或watch函数来达到类似的效果。computed属性可以自动追踪其依赖项，并在其中任何一个发生变化时重新计算它的值。watch函数可以监听指定的数据变化并执行相应的操作。

useEffect和生命周期方法有一些区别：

语法不同： useEffect 是一个函数，而生命周期是类中的方法。

触发时机不同： useEffect 在每次渲染之后被执行，而生命周期方法在组件的不同阶段被调用。例如，componentDidMount 只会在组件挂载后被调用一次，而 componentDidUpdate 会在每次更新后被调用。

作用不同： useEffect 用于执行副作用操作（如异步请求、订阅等），而生命周期方法则可以完成更多任务，如修改组件状态、访问DOM节点等。

清理操作不同： useEffect 可以返回一个清理函数，在下次渲染前或组件卸载时执行。生命周期方法也可以实现清理操作，但需要手动编写代码。

总的来说，useEffect 是相对于生命周期方法更加灵活且易于使用的方式来处理副作用操作。

3.react 中useState的使用