怎么解决的
怎么在小程序的tabs选项中添加vtabs选项?一、在原来的tabs选项中,如图: [图片] 其js代码如下: data: { tabs: [], activeTab: 0, }, onLoad() { const tabs = [ { title: '技术开发', }, { title: '产品解析', }, { title: '运营规范', }, { title: '营销经验', }, { title: '高校大赛', }, ] this.setData({ tabs }) }, onTabClick(e) { const index = e.detail.index this.setData({ activeTab: index }) }, onChange(e) { const index = e.detail.index this.setData({ activeTab: index }) }, handleClick(e) { wx.navigateTo({ url: './webview', }) } 二、添加vtabs选项,如图: [图片] 其js代码如下: data: { vtabs: [], activeTab: 0, }, onLoad() { const tabs = [ { title: '技术开发', title2: '小程序开发进阶', img: 'http://mmbiz.qpic.cn/sz_mmbiz_jpg/GEWVeJPFkSEV5QjxLDJaL6ibHLSZ02TIcve0ocPXrdTVqGGbqAmh5Mw9V7504dlEiatSvnyibibHCrVQO2GEYsJicPA/0?wx_fmt=jpeg', desc: '本视频系列课程,由腾讯课堂NEXT学院与微信团队联合出品,通过实战案例,深入浅出地进行讲解。', }, { title: '产品解析', title2: '微信小程序直播', img: 'http://mmbiz.qpic.cn/sz_mmbiz_png/GEWVeJPFkSHALb0g5rCc4Jf5IqDfdwhWJ43I1IvriaV5uFr9fLAuv3uxHR7DQstbIxhNXFoQEcxGzWwzQUDBd6Q/0?wx_fmt=png', desc: '微信小程序直播系列课程持续更新中,帮助大家更好地理解、应用微信小程序直播功能。', }, { title: '运营规范', title2: '常见问题和解决方案', img: 'http://mmbiz.qpic.cn/sz_mmbiz_jpg/GEWVeJPFkSGqys4ibO2a8L9nnIgH0ibjNXfbicNbZQQYfxxUpmicQglAEYQ2btVXjOhY9gRtSTCxKvAlKFek7sRUFA/0?wx_fmt=jpeg', desc: '提高审核质量', }, { title: '营销经验', title2: '流量主小程序', img: 'http://mmbiz.qpic.cn/sz_mmbiz_jpg/GEWVeJPFkSH2Eic4Lt0HkZeEN08pWXTticVRgyNGgBVHMJwMtRhmB0hE4m4alSuwsBk3uBBOhdCr91bZlSFbYhFg/0?wx_fmt=jpeg', desc: '本课程共四节,将分阶段为开发者展示如何开通流量主功能、如何接入广告组件、不同类型小程序接入的建议。', }, { title: '高校大赛', title2:'2020中国高校计算机大赛', img: 'http://mmbiz.qpic.cn/mmbiz_jpg/TcDuyasB5T3Eg34AYwjMw7xbEK2n01ekiaicPiaMInEMTkOQtuv1yke5KziaYF4MLia4IAbxlm0m5NxkibicFg4IZ92EA/0?wx_fmt=jpeg', desc: '微信小程序应用开发赛', }, ] this.setData({ vtabs: tabs }) }, onTabClick(e) { const index = e.detail.index console.log('tabClick', index) }, onChange(e) { const index = e.detail.index console.log('change', index) }, handleClick() { wx.navigateTo({ url: '../tabs/webview', }) } 添加后的效果,如图: [图片] 求大佬,其效果后的js代码如何合并? 谢大佬!
2021-04-12