未显式传递键名时如何识别POST请求body中值对应的键

• 你目前贴出的AComponent代码存在逻辑缺失：创建的myRef没有绑定到任何DOM元素，直接运行会因为myRef.current为undefined抛出异常。
• 从postData的实现逻辑可以推断，myRef实际应该绑定到一个HTML <form> 元素上，且该form的第一个子元素是表单输入控件（通常是type="hidden"的<input>），你需要补充对应的form渲染逻辑，示例如下：

const AComponent = () => {
  const myRef = React.useRef();
  const submit = () => {
    postData(myRef, 'some long token', 'www.google.com');
  };

  return (
    <>
      {/* 把myRef绑定到form元素 */}
      <form ref={myRef} method="post">
        {/* 第一个子元素就是postData中操作的控件，name属性就是POST参数的键名 */}
        <input type="hidden" name="token" />
      </form>
      <Button onClick={submit}>
        Click Me!
      </Button>
    </>
  );
};

• POST请求body的键名就是上面输入控件name属性设置的值，上面示例中设置name="token"，提交的参数键就是token。
• 额外注意：原生form表单默认提交的Content-Type为application/x-www-form-urlencoded，并不是你预期的JSON格式，请求体结构为键名=值的编码格式，而非{"键名":"值"}的JSON结构。如果你需要JSON格式的请求体，不能用原生form提交的方式，需要改用fetch、axios等请求库发起异步POST请求。

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