axios - Axios Vue Js:このオブジェクトの値を取得してAPIに表示する方法は、リクエストURLを取得します

Question

これは、テーブルからIDを受け入れる私のv​​ueファイルです。これは機能します。テーブル行からデータIDを取得できます

  showProd (id) {
   Products.showProd().then((response) => {
     console.log(show1prod.product_name)
   })
   .catch((error) => {
     alert(error)
   })

これは、axios.get を呼び出すための構成ファイルです。バックエンドに到達できますが、この URL/API が ID 番号ではないと思われるオブジェクトを送信するため、クエリを生成できません。

export default {
    async showProd(id) {
        return Api.get('/products/{id}',id)
    },

    loadProds () {
        return Api.get('/products')
    }

}

Answer 1

まず、API 呼び出しが正しいことを確認してください。

export default {
    showProd(id) { // async not needed, axios returns promise
        return axios.get('/products/' + id)
    },

    loadProds () {
        return axios.get('/products')
    }
}

これらの関数を呼び出すことができます。

showProd (id) {
   Products.showProd(id).then((response) => { // Note the id in the call
     console.log(response.data.product_name) // Use the response object
   })
   .catch((error) => {
     alert(error)
   })