VUE 取得點擊的資料

vue.js vue js javascript quasar

老安不要 2019-08-06 10:38:42 ‧ 2087 瀏覽

分享至

先上CODE

<div v-for="item in items" :key="item.id">
    <transition appear enter-active-class="animated bounceIn">
    <q-item  to="/main">
    <img v-bind:src="item" class="responsive" />
    </q-item>
    </transition>
</div>

我的頁面會以陣列items的資料印出三張圖片
我的邏輯是在q-item裡面放一個方法辨識我點擊的是哪一張圖

    <q-item v-on="method()" to="/main">

但不知道該怎麼辨識，
items陣列會依據不同使用者有不同的資料，
items陣列是動態的資料。

item陣列大概長這樣

["statics/pm.png","statics/pmm.png","statics/mpm.png","statics/ppm.png"]

登入發表討論

直播研討會

{{ item.channelVendor }} {{ item.webinarstarted }} |

直播中

3 個回答

Wayne Chang

iT邦新手 4 級 ‧ 2019-08-06 10:57:13

最佳解答

試試讓你的 Method 收一個參數
用 v-on 的時候傳進去簡單試了一下看看你要的是不是這樣

https://codepen.io/judysocute/pen/NQXgPP?editors=1010

回應 1
分享
檢舉

老安不要 iT邦新手 5 級 ‧ 2019-08-06 11:18:13 檢舉

感謝詳細的CODE~

登入發表回應

laibin

iT邦見習生 ‧ 2019-08-06 10:44:58

method(item), 将当前点击的数据传参进去

回應
分享
檢舉

登入發表回應

dragonH

iT邦超人 5 級 ‧ 2019-08-06 11:02:49

codepen

click 可以帶 params 進去

看你要直接傳 item

或是傳 index 都可以

比較需要注意的是

剛試了

<q-item @click="myClick(item)"></q-item>

無法觸發

必須使用

<q-item @click.native="myClick(item)"></q-item>

參考

回應 2
分享
檢舉

老安不要 iT邦新手 5 級 ‧ 2019-08-06 11:17:59 檢舉

這個我知道唷~~~~
貼上來的時候為了簡化就沒打上去了
因為D大妳比二樓慢一點最佳解我就給他了
還是謝謝你喔 ><

dragonH iT邦超人 5 級 ‧ 2019-08-06 11:24:11 檢舉

登入發表回應

我要發表回答

立即登入回答

參賽組數

1064 組

團體組數

40 組

累計文章數

22207 篇

完賽人數

600 人

15th鐵人賽 16th鐵人賽 13th鐵人賽 14th鐵人賽 12th鐵人賽 11th鐵人賽鐵人賽 2019鐵人賽 javascript 2018鐵人賽 python 2017鐵人賽 windows php c# windows server linux css react vue.js

IT邦幫忙