1. 程式人生 > >微信小程式中的迴圈列表,在點選時改變當前項的背景顏色

微信小程式中的迴圈列表,在點選時改變當前項的背景顏色

之前自己在網上找這個功能時,花了我大量的時間也沒找到好一點的方法,於是我自己想出了一個解決方案,不知道其是否實用,反正先放出來,如果有不對的地方請指出。菜鳥一個,求帶!廢話不多說,我就直接上demo圖:

圖一

我們看到程式碼
圖二

我們先給我們的主介面設定兩個區域塊left_menu 和 right_content .

left_menu: 我們通過wx:for 來遍歷我們穿過來的資料。並給我們的view繫結一個點選事件,以及設定Id。
圖三

我們可以看到,我們在js檔案中,設定點選事件,並通過setData將我們獲取到的id(被點選的view的id)傳入到我們的wxml中。並在我們(圖二)的xml中通過wx:if 來判斷當前點選的view是否等於我們view的index,這樣我們就能夠動態的選擇相應的view來展示即將點選的view 的背景顏色改變。

right_content:我們直接在我們的js程式碼中,確認我們所點選的view的內容通過setData直接傳入(圖三)

這樣我們就實現了tab的點選改變背景顏色,點選其他tab時,將之前的顏色修改回來,並改變點選的tab的顏色。

以上。
如果有更好的方法求告知,謝謝哥哥姐姐們!