微信小程序左右菜单mysql_微信小程序tab左右滑动切换功能的实现代码

效果图:

一、简介

自己的小程序需要实现这样的功能

1.核心思想

swiper 和scroll-view共用两个变量currentTab  navScrollLeft，当点击nav或者滑动swiper时设置两个变量的值为当前的index

二、实现

tab导航栏使用标签，内容使用

1.wxml实现

{ {navItem.text}}

class="tab-content">

{ {tabItem}}

2.js实现

//index.js

//获取应用实例

const app = getApp()

Page({

data: {

navData:[

{

text: "新闻"

},

{

text: "表白"

},

{

text: "外卖"

},

{

text: "当家教"

},

{

text: "找家教"

},

{<