作者godman362 (卯)
看板Ajax
標題[問題] Vue 的 v-on 作用範圍
時間Thu Mar 16 14:06:57 2017
請教一下，我目前寫了一段nested v-for
其中cmdlist是一個Object 內裝Array的資料結構
如： { a: [1,2,3], b: [3,4,5], c: [5,6,7], d: [7,8,9] }
想在HTML呈現如下表示：
a
1
2
3
b
3
4
5
c
5
6
7
d
7
8
9
<li v-for="(item_list, key, index) in cmdlist" v-on:click="toggle(index)">
{{key}}
<ul v-if="boxes[index].show" v-for="item in item_list">
<li>{{item}}</li>
</ul>
</li>
在HTML頁面上呈現出的結果是對的，不過錯誤的是v-on:click的地方
我預期v-on:click的作用範圍只有在第一層<li> tag的部分
結果連第二層的<li> tag也受到影響
想請教這部分應該如何進行修正？ 還望先進指點，感謝
--
ˍˍ
很多人在即將失去的時候，不知他即將失去，最後他就真正失去 ▕天險▏
其實，一個不曾失去的人最可憐。因為，他永遠學不會什麼叫珍惜。▕刀藏▏
￣￣
--
※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 220.134.71.154
※ 文章網址: https://webptt.com/m.aspx?n=bbs/Ajax/M.1489644420.A.9D7.html
※ 編輯: godman362 (220.134.71.154), 03/16/2017 14:07:43
1F：→ itisjoe: {{key}}這行加個標籤 再將 v-on:click 放在這標籤中呢? 03/16 15:24
2F：→ godman362: 加標籤是指用div再包一層嗎? 我這樣試過，結果一樣 03/16 15:32
3F：→ godman362: 不好意思，剛剛改錯，照i大的說法是可以的 03/16 15:36
4F：→ godman362: 可是我還是不明白v-on的作用，可否指點一二？ 03/16 15:38
5F：→ godman362: 或是可以提點一下keyword怎麼找，我目前google不到 03/16 15:38
6F：→ godman362: 跟我一樣的狀況 03/16 15:38
7F：→ godman362: 這個問題跟Vue無關，剛剛試了純HTML就會有這問題 03/16 16:13
8F：→ godman362: 因為是我對HTML的運作有誤解，先謝謝i大 03/16 16:13
9F：→ hankhu: 感覺跟event bubbling有關 03/23 12:08
10F：→ hstt: @click.self 01/05 17:29