您现在的位置是：首页 >技术杂谈 >关于useFormStatus 19版本 (react-dom提供)网站首页技术杂谈

    const { pending, data, method, action } = useFormStatus();

    pending：布尔值。
            如果为 true，则表示父级 <form> 正在等待提交；否则为 false。
            
    data：实现了 FormData interface 的对象，包含父级 <form> 正在提交的数据；
          如果没有进行提交或没有父级 <form>，它将为 null。
          
    method：字符串，可以是 'get' 或 'post'。
           表示父级 <form> 使用 GET 或 POST HTTP 方法 进行提交。
           默认情况下，<form> 将使用 GET 方法，并可以通过 method 属性指定。
           
    action：一个传递给父级 <form> 的 action 属性的函数引用。
           如果没有父级 <form>，则该属性为 null。
           如果在 action 属性上提供了 URI 值，或者未指定 action 属性，status.action 将为 null。

    注释：只要Button组件在form标签中，
         可以通过useFormStatus拿到form表单的提交状态(pending)
         以及form表单的input数据，提交表单的接口协议（get/put/post....）
         还有form表单的action(提交接口)

    import React from 'react'
    import { useFormStatus } from "react-dom"
    const Button = function Button(props) {
      let { type } = props
      const { pending, data, method, action } = useFormStatus()
      console.log(pending, data?.get('name'), method, action);
      return <button type={type} disabled={pending}>{pending ? 'loading...' : 'submit'}</button>
    }
    function Index() {
      return (
        <form action={() => new Promise((resolve, reject) => {
          setTimeout(() => {
            resolve('success')
          }, 2000)
        })
        }>
          <input type="text" name='name' />
          <Button type={'submit'} />
        </form>
      )
    }
    export default Index