teratail header banner
teratail header banner
質問するログイン新規登録

質問編集履歴

1

文字の修正

2021/08/31 05:10

投稿

yukiman
yukiman

スコア7

title CHANGED
@@ -1,1 +1,1 @@
1
- 【Vue.firebase】テーブル内のモーダルに各ユーザー情報を表示させたい
1
+ ????【Vue.firebase】テーブル内のモーダルに各ユーザー情報を表示させたい
body CHANGED
@@ -5,9 +5,18 @@
5
5
 
6
6
  現在、モーダルを開くと、ログインしていないユーザー情報がすべて同じモーダルに表示されてしまいます。
7
7
  クリックしたときに、そのユーザーと一致する情報を取得し、表示したいです。
8
+
9
+ Home.vueで
10
+ ```ここに言語を入力
11
+ openModal (user,index){
12
+ console.log(user)
13
+ ```
14
+ でコンソールで確認すると、クリックしたユーザーの情報が取得できてはいるのですが、これをモーダルに反映させる方法が何度試行錯誤してもわかりません。
15
+
8
16
  初学者なため、基礎的な質問かもしれませんが、ご教授いただけると幸いです。
9
17
 
10
18
  ![イメージ説明](5716f6bd3d17bf6f2ca6c1e5e16b5f1f.png)
19
+ ![イメージ説明](fd840ca72c6789e786603358d929907d.png)
11
20
 
12
21
  ### 該当のソースコード
13
22
 
@@ -28,7 +37,7 @@
28
37
  </thead>
29
38
  <tr v-for="(user,index) in userData" v-bind:key="index">
30
39
  <td>{{ user.name}}</td>
31
- <td><button class="button2" @click="openModal(index)">Walletを見る</button></td>
40
+ <td><button class="button2" @click="openModal(user,index)">Walletを見る</button></td>
32
41
  <td><button class="button2" @click="openModal2(index)">送る</button></td>
33
42
  </tr>
34
43
  </table>
@@ -76,7 +85,8 @@
76
85
  };
77
86
  },
78
87
  methods: {
79
- openModal (index){
88
+ openModal (user,index){
89
+ console.log(user)
80
90
  this.showContent = true
81
91
  this.usersIndex = index
82
92
  const usersIndex = this.usersIndex