vue.jsでaxiosのgetアクションを使用してlaravelから帰ってくる値を取得して表示するという処理についてです。
解決したいこと {{find_user(hope.user_id)}}を呼び出した際にreturnで値を返して表示させたい。
現状: console.log(res.data.name)で値は確認できるが、returnではview側に表示されない。
<div v-for="hope in hopes" :key="hope.id"> <tr> <th scope="row">{{hope.id}}</th> <td>{{find_user(hope.user_id)}}</td> <td>{{hope.text}}</td> </tr> </div> 省略。。 props: ['hopes'], methods: { find_user(here_user_id) { axios.get(example-path).then(res => { console.log(res.data.name) return res.data.name }).catch(function(error){ console.log(error) }) } }
メソッドの返り値(name)をそのままviewに表示したいと思っているのですが、
getの場合はreturnで返り値をそのままviewに表示ということはできないのでしょうか?
確認したサイト
https://teratail.com/questions/235618
どなたかお分かりになる方居ましたら、ご教授いただきたいです。
よろしくお願いします。
vue.js 2.6.1
laravel 7.2
追記
最初は以下のようにやっていたのですが、以下の部分を省略できないかと考えました。
created()でfind_userを呼び出そうかと考えましたが、hope.user_idをどう持ってこようかというところで悩んでいます。
<div v-for="hope in hopes_array" :key="hope.id"> <tr> <th scope="row">{{hope.id}}</th> <td>{{find_user(hope.user_id)}}</td> <td>{{name}}</td> <td>{{hope.text}}</td> </tr> </div> 省略... data() { return { hopes_array: this.hopes, name: '' } }, 省略... find_user(here_user_id) { let id = this.room.id let get_path = ["http://127.0.0.1:8000/room/", id, "/find/"]; let here_path = get_path.join('') axios.get(here_path + here_user_id).then(res => { return this.name = res.data.name }).catch(function(error){ console.log(error) }) },
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2020/07/30 02:11
2020/07/30 03:07 編集
2020/08/03 02:56