'Axios Vue: undefined post parameters in express server but defined in Vue

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?



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source