这篇博客探讨了如何使用一维数组和二维数组管理座位状态，通过十六进制颜色标识状态，以灵活应对新增状态。同时，采用列表渲染处理活动信息，便于后期修改。在用户交互方面，实现了点击座位时取消其他座位选中状态的功能，并计划优化实现。此外，针对不同教室规模，页面加载时动态调整座位尺寸，确保视觉效果。后台与前端的配合也是关键，如教室大小与座位适配的阈值设定。
1. 状态栏数组，以对象为元素的一维数组
2.座位状态表，以座位作为对象的二维数组，以此形式存储空间信息
此处以十六进制颜色作为状态标识，主要是考虑到后续如果添加某个新的状态，能够不修改小程序代码，只需要后台传数据时，传入新的颜色即可。
3.活动信息 同样考虑到后续的信息添加或修改，采用列表渲染
4.此处是一个方法，在用户点击某个座位时，取消其他座位的选取状态
5. 此处是用户点击某个座位时触发的函数，用来切换座位颜色，在第一次逻辑写完后，发现了另一种简洁的实现方法，如果时间允许，将在后续迭代中修改。
6.页面加载时，根据后台传来的教室大小（座位行列数）进行页面的适配，此功能需要与后台对接后进行一个阈值的确定，因为如果座位数过少，则座位相应的应当变大，（主要是宽度变大），但是高度不能简单的线性的变大（列数少，行数多的教室显示出来会很影响使用），还有是列数和行数比较多的教室，则需要设定座位的最小高宽，座位拥挤则用页面缩放来解决（主要是放大）
扫一扫
3035
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
