微信小程序:“我的”页面布局(二):可配置功能菜单列表

  • A+

前一篇微信小程序:“我的”页面布局(一):微信用户信息获取及UI已经介绍了功能菜单列表的实现方式,因为篇幅问题,到这里再详细说下...

比较懒,还是上一篇的图:

 

微信小程序:“我的”页面布局(二):可配置功能菜单列表
微信小程序--“我的“页面.jpg

如上一篇所属,“我的”页面菜单列表主要是用到了wx: for和navigator

二、 功能菜单列表

wxml:

利用navigator可以很方便的实现菜单功能,它带有的url和class、hover-class可以很轻松的设置点击效果及点击跳转地址:

wxss:

js

在js中甚至不需要做什么事情,我这里把菜单的数据放在了js中,通过修改data中的menuitems即可达到配置的作用,甚至如果有需求,还可以放在服务端做成可随意变化的:

简书:ThinkinLiu 博客: IT老五


微信小程序:“我的”页面布局(二):可配置功能菜单列表
IT老五(it-lao5):关注公众号,一起源创,一起学习!

相关推荐:

微信小程序:“我的”页面布局(一):微信用户信息获取及UI
微信小程序:“我的”页面布局(二):可配置功能菜单列表

weinxin
我的微信公众号
我的微信公众号扫一扫
Liu, Thinkin

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

目前评论:1   其中:访客  0   博主  0   引用   1

    来自外部的引用: 1

    • 微信小程序:一套开源微信小程序ui – IT老五