微信小程序 仿美團(tuán)分類(lèi)菜單 swiper分類(lèi)菜單
更新時(shí)間：2017年04月12日 09:17:57 作者：dzp_coder
本文主要介紹了微信小程序仿美團(tuán)分類(lèi)菜單（swiper分類(lèi)菜單）的相關(guān)知識(shí)。具有很好的參考價(jià)值。下面跟著小編一起來(lái)看下吧
有同學(xué)要仿美團(tuán)分類(lèi)菜單.寫(xiě)了一個(gè).
跟 微信小程序開(kāi)發(fā)之實(shí)現(xiàn)選項(xiàng)卡(窗口頂部TabBar)頁(yè)面切換很類(lèi)似
代碼:
js就這么一點(diǎn)
//index.js
//獲取應(yīng)用實(shí)例
var app = getApp()
Page({
data: {
currentTab: 0,
grids: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9],
swiperList:[0, 1, 2, 3, 4]
},
onLoad: function () {
},
click: function (e) {
console.log(e.currentTarget.dataset.id)
console.log(e.currentTarget.dataset.index)
wx.showToast({
title: '第' + e.currentTarget.dataset.id + '欄' + '第' + e.currentTarget.dataset.index + '個(gè)',
icon: 'success',
duration: 1500
})
},
/**
* 滑動(dòng)切換tab
*/
bindChange: function (e) {
console.log(e.detail.current)
this.setData({ currentTab: e.detail.current });
},
})
以上就是本文的全部?jī)?nèi)容，希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來(lái)一定的幫助，同時(shí)也希望多多支持腳本之家！
相關(guān)文章
JavaScript判斷兩個(gè)數(shù)組相等的4類(lèi)方法總結(jié)
如果我們需要比較兩個(gè)數(shù)組是否相等，不能像比較基本類(lèi)型(String、Number、Boolean等)一樣，使用 === (或 ==) 來(lái)判斷，所以如果要比較數(shù)組是否相等，需要使用一些特殊方法。本文為大家整理了四種常見(jiàn)用法，需要的可以參考一下2023-02-02
js實(shí)現(xiàn)隨屏幕滾動(dòng)的帶緩沖效果的右下角廣告代碼
這篇文章主要介紹了js實(shí)現(xiàn)隨屏幕滾動(dòng)的帶緩沖效果的右下角廣告代碼,涉及javascript基于數(shù)學(xué)運(yùn)算及定時(shí)函數(shù)動(dòng)態(tài)操作頁(yè)面元素的實(shí)現(xiàn)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-09-09
詳解在微信小程序的JS腳本中使用Promise來(lái)優(yōu)化函數(shù)處理
這篇文章主要介紹了詳解在微信小程序的JS腳本中使用Promise來(lái)優(yōu)化函數(shù)處理，引入Promise確實(shí)能夠很好的解決異步回調(diào)函數(shù)的可讀性等問(wèn)題，同時(shí)也使得我們調(diào)用的時(shí)候代碼簡(jiǎn)潔一些，本文介紹如何在小程序的JS代碼里面使用Promise來(lái)封裝一些函數(shù)的做法2019-03-03
javascript實(shí)現(xiàn)攝像頭拍照預(yù)覽
這篇文章主要為大家詳細(xì)介紹了javascript實(shí)現(xiàn)攝像頭拍照預(yù)覽，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-09-09
js原生跨域_用script標(biāo)簽的簡(jiǎn)單實(shí)現(xiàn)
下面小編就為大家?guī)?lái)一篇js原生跨域_用script標(biāo)簽的簡(jiǎn)單實(shí)現(xiàn)。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-09-09
WEB前端開(kāi)發(fā)框架Bootstrap3 VS Foundation5
WEB前端開(kāi)發(fā)框架Bootstrap3 VS Foundation5,這篇文章主要介紹了Bootstrap3與Foundation5的五大區(qū)別,感興趣的小伙伴們可以參考一下2016-05-05
JavaScript實(shí)現(xiàn)解析INI文件內(nèi)容的方法
這篇文章主要介紹了JavaScript實(shí)現(xiàn)解析INI文件內(nèi)容的方法,結(jié)合實(shí)例形式分析了javascript通過(guò)自定義函數(shù)實(shí)現(xiàn)針對(duì)ini文件解析操作的相關(guān)處理技巧,需要的朋友可以參考下2016-11-11
在這里和廣大腳本之家站的朋友們分享一個(gè)使用js實(shí)現(xiàn)商城星星評(píng)分的效果，希望能給大家點(diǎn)幫助2014-07-07
這篇文章主要介紹了javascript中Promise使用詳解，關(guān)于Promise的使用相關(guān)的知識(shí)點(diǎn)下面文章內(nèi)容介紹詳細(xì)具有一定的參考價(jià)值，需要的小伙伴可以參考一下2022-04-04
js防刷新的倒計(jì)時(shí)代碼 js倒計(jì)時(shí)代碼
這篇文章主要為大家詳細(xì)介紹了js防刷新的倒計(jì)時(shí)代碼，js倒計(jì)時(shí)的實(shí)現(xiàn)代碼，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-09-09