使用JavaScript获取发布数据的正确方法是什么？

Question

我正在尝试摆脱jQuery，并开始使用承诺和箭头功能。尽我所能，我似乎无法使用JavaScript获取将数据传递给PHP。

$btnarrmem.addEventListener('click',()=>{
        let $url = "getMember.php";
        let $data = {vid: '527571'}
        $data = JSON.stringify($data);
        console.log ($data);
        fetch ($url, {
            method:'POST',
            headers :{
                'Accept': 'application/json',
                'Content-Type': 'application/json;charset=utf-8'
            },
            body:$data
        })

        .then((response)=>{
            console.log (response.text())


        })
     

结果始终是

Promise {<pending>}
[[Prototype]]: Promise
[[PromiseState]]: "fulfilled"
[[PromiseResult]]: *"Notice</b>:  Undefined index: data in /mnt/development/websites/arrows/getMember.php< on line <b>7<*emphasized text**

对我来说，PHP没有获得数据。

这是使用jQuery编写的相同功能，就像我想要的那样，

let $data = {vid: '527571'}
$data = JSON.stringify($data);
console.log($data);
$('button.qrymem').click(function () {
    let $data = {vid: '527571'}
    $data = JSON.stringify($data);
    console.log ($data);
    $.post('getMember.php', {data: $data}, function ($result) {
        console.log($result);
        $divquery.text($result);
    })

})

它可以欣赏任何建议，以使我朝着正确的方向前进。

Answer 1

jQuery URL编码数据。您需要调用encodeuricomponent（）来执行此操作，然后将其作为data参数的值传递。等效于fetch（）是：

$btnarrmem.addEventListener('click', () => {
  let $url = "getMember.php";
  let $data = {
    vid: '527571'
  };
  $data = JSON.stringify($data);
  console.log($data);
  fetch($url, {
      method: 'POST',
      headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/x-www-form-urlencoded'
      },
      body: `data=${encodeURIComponent($data)}`
    })

    .then((response) => {
      console.log(response.text())


    })
});