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

回答編集履歴

1

vueファイルの記述からHTML/JS向けの記述に変更

2019/12/12 03:17

投稿

nt4c
nt4c

スコア768

answer CHANGED
@@ -1,8 +1,8 @@
1
1
  jQueryと併用すること自体に無理が生じているので、jQueryにこだわらないのであれば下記の方法で問題ないように思えます。
2
2
  jQueryで追加している箇所はhtml側に記述し`add_link`の処理はmethodsで行うようにすれば簡潔に収まります。
3
3
  まとめるためにvueの記述で書きますが要点は同じです。
4
- ```vue
4
+ ```html
5
- <template>
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
- </template>
16
+ </div>
17
+ ```
17
18
 
18
- <script>
19
+ ```js
19
- export default {
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
  ```