vueを使って、テーブルを表示させています。
テーブルの該当欄をダブルクリックした際に、textarea
を表示させ、そのレコードのみを編集できるように作りたいです。
vueで、以下のようなイメージになります(骨子)。
html
1 <tr v-for="rec in records"> 2 <td>{{rec.a}}</td> 3 <td>{{rec.b}}</td> 4 <td @dblclick="edit_me"> 5 {{rec.c}} 6 <textarea v-if="????????"></textarea> 7 </td> 8 </tr>
分からないのがv-if
の部分です。
普通にseen.xxx
などとしてしまうと、v-for
で表示されているレコード全てに影響が及び、全てにテキストエリアが表示されてしまいます。
編集したい対象のレコードだけにテキストエリアがあらわれるようにするにはどうしたらよいでしょうか。
なお、現状ではtd
にtextarea
をappend
する形をとっています。そうではなく、vueの枠組みで処理したいと思っています。
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
退会済みユーザー
2018/07/17 09:32
2018/07/17 09:44
退会済みユーザー
2018/07/19 23:51