标签：flex seventeen 40rpx width 影院 影厅 margin id 选座

小程序实现电影院选座问题

首先数据库建立

 

 

 

 

 

 

 电影票关联影厅，座位同样关联影厅。

使电影票：影厅：座位信息成为1：1：n

根据电影票获取影厅

 

 

根据获取影厅的id获取影厅对应的座位信息（因为数据超过20条，所以使用云函数来获取）

 

 云函数：

 

 

 

获取到座位信息输出到wxml页面上

 

 wxss为

.paizuo{   width: 95%;   display: flex;   flex-wrap: wrap;   margin-left: 2.5%; } .zuowei{   margin-left:5rpx;   display: flex;   margin-top: 20rpx;   display: flex;   width: 16%;   height: 40rpx;   text-align: center; } .xuan{ margin-left:30%; width: 40rpx; height: 40rpx; background-color: chartreuse; } .wei{ margin-left:30%; width: 40rpx; height: 40rpx; border: cadetblue solid 1rpx; } 点击改变座位信息：    // 点击改变座位状态   xinxi(e){     console.log(e.currentTarget.dataset.id)     let id = e.currentTarget.dataset.id     sum=sum+1     console.log(sum)     if (sum%2==0) {       db.collection('seat').doc(id).update({         data:{           xuan:false         }       })       this.getHall()//为了刷新页面       this.setData({         xinxiList:''       })     }else{     db.collection('seat').doc(id).get()     .then(res=>{       console.log(res.data)       this.setData({         xinxiList:res.data       })     })     db.collection('seat').doc(id).update({       data:{         xuan:true       }     })     this.getHall()//为了刷新页面   }   },

 

 

 

 

标签：flex,seventeen,40rpx,width,影院,影厅,margin,id,选座
来源： https://www.cnblogs.com/TenDays/p/16166492.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。