回答編集履歴
1
vueファイルの記述からHTML/JS向けの記述に変更
answer
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
jQueryと併用すること自体に無理が生じているので、jQueryにこだわらないのであれば下記の方法で問題ないように思えます。
|
|
2
2
|
jQueryで追加している箇所はhtml側に記述し`add_link`の処理はmethodsで行うようにすれば簡潔に収まります。
|
|
3
3
|
まとめるためにvueの記述で書きますが要点は同じです。
|
|
4
|
-
```
|
|
4
|
+
```html
|
|
5
|
-
<
|
|
5
|
+
<div id="app">
|
|
6
6
|
<div class="item" v-for="(product, index) in List" :key="product.id" >
|
|
7
7
|
<label>
|
|
8
8
|
<div class="detail">{{product.title}}
|
|
@@ -13,15 +13,18 @@
|
|
|
13
13
|
</div>
|
|
14
14
|
</label>
|
|
15
15
|
</div>
|
|
16
|
-
</
|
|
16
|
+
</div>
|
|
17
|
+
```
|
|
17
18
|
|
|
18
|
-
|
|
19
|
+
```js
|
|
19
|
-
|
|
20
|
+
var app = new Vue({
|
|
21
|
+
el: '#app',
|
|
22
|
+
data: {}, // 記述省略
|
|
23
|
+
computed: {}, // 記述省略
|
|
20
24
|
methods: {
|
|
21
25
|
add_link() {
|
|
22
26
|
// 処理
|
|
23
27
|
}
|
|
24
28
|
}
|
|
25
|
-
}
|
|
29
|
+
});
|
|
26
|
-
</script>
|
|
27
30
|
```
|