微信小程序之多级联动菜单

多级联动菜单在许多的筛选场景应用十分广泛。

先看看效果图：

menu.wxml

menu.wxss

menu.jsp

menu.wxss

menu.js

menu.wxml

menu.wxss

menu.js

这里主要针对一个菜单栏进行详细讲解，其余两个原理相同。

游戏

menu.wxml

这里推荐大家使用 <scroll-view></scroll-view> 组件，这样超过限定的高度的话，就可以在内部产生滚动条，整体布局不会乱。使用 <scroll></scroll> 组件的时候，记得要开启滚动的方向（scroll-y表示纵向，scroll-x表示横向），这些属性默认是关闭的。

menu.wxss

注意：使用竖向滚动时，需要给<scroll-view/>一个固定高度，通过 WXSS 设置 height。

menu.js

menu.js部分主要的难点就是wxml和js之间的数据交互，这里很容易弄晕，尤其是对自己定义的变量弄清楚是什么意思。在这里我画了一个示意图来讲解这个难点。

最后给大家提供该项目的github项目，直接抓下来就可以打开使用，只需对显示的数据进行修改即可。

小程序也是变得非常的火了，可对餐饮行业最困扰的还是小程序点单系统怎么弄?小的在这愿意为笔者解答，希望可以有作用。

1、我们常常会见到这样的词汇：小程序点餐、扫码点餐、二维码点餐、微信点餐，其实全部的微信点餐能够归为两类，一类是建立在微信公众号上的点餐系统，一类是建立在小程序上的点餐系统。

2、详细开通流程：百度搜索微信公众平台，打开网址注册申请一个微信公众号或者小程序，注册过程非常简单，在这里也就不做说明了，记录号自己的登陆账号与密码。

3、依照点餐平台的提示将微信公众号与点餐平台绑定，授权同意使用第三方平台订餐系统：点击【智能绑定】-【扫描二维码完成绑定】

4、为订餐系统配置打印机，添加打印功能：点击【打印机】-【配置打印机】-【添加打印机设备】-【开启自动接单开关】。

5、自定义公众号菜单设置：找到【管理中心】→【微信基础设置】→【自定义菜单】点击右上角的“新增”，母菜单菜单只可以增加三个，每个母菜单又能够分别增加五个子菜单。示例如下图所标识。

6、选择点餐页面模板，如下图所示，一种是小图标呈纵向排列，一种是大图标呈横向排列。

7、点餐系统每个页面链接地址在哪里查看?【商家后台】-【管理中心】-【微外卖】-【门店管理】-点击【查看链接】。注：这些页面链接能够直接自定义到母菜单及子菜单里，可是只有认证过的公众号才可以自定义外部链接，若是你的公众号没有认证就不能自定义。

8、门店商品上传能够批量导入，制作好Excel表格直接一键导入，外卖的商品能够直接一键同步到堂食商品：【管理中心】-【控制台】-【微外卖】。

9、在后台添加门店包间与桌位号：【管理中心】-【控制台】-【平板点餐】-【桌号管理】里设置。

10、将每个桌位的二维码都下载下来，然后打印出来制作成贴纸或者台卡，放在对应的桌号位上，当顾客到店之后扫码就能开始点餐，不用排队了。

11、点外卖的顾客能够利用关注微信公众号，找到点餐页面点击进入，开始网上下单点餐，厨房打印机自动打印机小票，出餐，配送员送餐。

不知道小程序点单系统怎么弄的相信看了都会知道了，能够帮助到大家我也就开心了!

---