Axios Vue: undefined post parameters in express server but defined in Vue-CodePudding

I have an <img> element like this:

<img v-bind:word = "thing" @click="action" align="center" src="../assets/pic.png"/>

and a method like this:

 async action() {
      let imgAttribute = event.target.getAttribute('word');
      alert(imgAttribute ); // alerts OK
      console.log("imgAttribute : "   imgAttribute ); // prints OK

     await axios.post('http://localhost:3000/my/endpoint',
         {
           params: {
             word: imgAttribute 
           }
         });
...

So when the <img> element is clicked, the method action is executed. The word attribute is taken and put in imgAttribute variable, which is then passed as a parameter in the post request.

alert(imgAttribute) and console.log(imgAttribute) work fine, which means they don't print undefined, but print correct string values that are inside word attribute.

However on Express server:


app.post('/my/endpoint', async (req, res) => {
    const {word} = req.params;  // tried req.query with the same (undefined) result
    console.log("word = "   word); // undefined
...

The word is undefined.

Why does it happen? How do I fix it?

CodePudding user response：

You passed as body via .post, to pass as params use

  await axios({
    url: 'http://localhost:3000/my/endpoint',
    method: 'post',
    params: {
        word: imgAttribute 
    }
  })