使用goEasy实现多对多实时点餐程序

新建一个uniapp项目，引入goEasy插件

npm install goeasy@2.6.2 --save

在main.js引入goeasy并注册

import App from './App'
import GoEasy from 'goeasy'// #ifndef VUE3
import Vue from 'vue'
Vue.config.productionTip = false
App.mpType = 'app'
const app = new Vue({...App
})
app.$mount()
// #endifVue.prototype.GoEasy = GoEasy
let goeasy = GoEasy.getInstance({host:"hangzhou.goeasy.io",  //若是新加坡区域：singapore.goeasy.ioappkey:"BC-e1f69be1cd6e409f944f3e1285c257c7",modules:['pubsub']//根据需要，传入‘pubsub’或'im’，或数组方式同时传入
});Vue.prototype.goEasy = goeasy//建立连接
goeasy.connect({id:"test_channel", //pubsub选填，im必填，最大长度60字符// id:uni.getSystemInfoSync().deviceId, //pubsub选填，im必填，最大长度60字符data:{"avatar":"/www/xxx.png","nickname":"Neo"}, //必须是一个对象，pubsub选填，im必填，最大长度300字符，用于上下线提醒和查询在线用户列表时，扩展更多的属性onSuccess: function () {  //连接成功console.log("GoEasy connect successfully.") //连接成功},onFailed: function (error) { //连接失败console.log("Failed to connect GoEasy, code:"+error.code+ ",error:"+error.content);},onProgress:function(attempts) { //连接或自动重连中console.log("GoEasy is connecting", attempts);}
});

编写模板页面

<template><view class="content"><!--   <u-modal v-model="isModel" title="请输入用户名"><view><input style="padding: 20rpx;border: 1rpx solid #eee;margin: 30rpx;" v-model="userId" /></view></u-modal> --><!-- 顶部 --><view class="top-view"><view>{{number_people}}人就餐</view><view class="top-view-flex"><image src="/static/tab/fenxiang.svg" mode="widthFix" class="top-search"></image><image src="/static/tab/dingdan.svg" mode="widthFix" @click="my_order()"></image></view></view><view class="order-view"><view class="commodity"> <!-- 左 --> <view class="order-left"><scroll-view scroll-y="true" class="scroll-Hei" :scroll-with-animation="true" :enhanced="true":show-scrollbar="false"><block v-for="(item,index) in itemize" :key="index"><view class="itemize-text" :class="{active: index == trigger}"@click="itemIze(index,item.cid)"><text>{{item.value}}</text><text v-if="item.sele_quantity > 0">{{item.sele_quantity}}</text></view></block></scroll-view></view><!-- 右 --><view class="order-right"><scroll-view scroll-y="true" class="scroll-Hei" :scroll-with-animation="true" :enhanced="true":show-scrollbar="false" :scroll-into-view="scroll_into" @scroll="scroLl"><block v-for="(item,index) in goods" :key="index"><view :id="item.cid" class="rig-height"><view class="classif">{{item.category}}</view><view class="classif-goods" v-for="(itemgood,good_index) in item.good_query":key="good_index" @click="popup_item(true,index,good_index,item.cid,itemgood)"><view class="goods-image"><image :src="itemgood.image[0].url" mode="aspectFill"></image></view><view class="goods-Price"><view class="goods-name"><text class="Bold">{{itemgood.name}}</text><text class="Thinning">已售 {{itemgood.monthlysale}}</text></view><view class="unit-price"><text class="Symbol">¥</text><text class="Bold">{{itemgood.unitprice}}</text><text class="Thinning">/{{itemgood.unit}}</text></view></view><!-- 无规格 --><view class="quantity" v-if="!itemgood.att_hide"><view><image v-if="itemgood.quantity > 0" src="/static/tab/jianhao.png"mode="widthFix"@click.stop="channel('reduce',[index,good_index,item.cid,itemgood])"></image></view><view><text v-if="itemgood.quantity > 0">{{itemgood.quantity}}</text></view><view><image src="/static/tab/jia.png" mode="widthFix"@click.stop="channel('plus',[index,good_index,item.cid,itemgood])"></image></view></view><!-- 有规格 --><view class="quantity specs-view" v-if="itemgood.att_hide"><text>选规格</text><text v-if="itemgood.quantity > 0">{{itemgood.quantity}}</text></view></view></view></block><view style="height: 400rpx;"></view></scroll-view></view></view><!-- 底部 --><view class="order-bottom" @click="pop_Shopping()" :style="{'padding-bottom': Modelmes ? '68rpx' : ''}"><view class="Shopping" style="width: 115rpx;"><view class="Shopping-left"><image src="/static/tab/gouwuche.png" mode="widthFix"></image></view><view class="Shopping-number" v-if="total_quantity > 0">{{total_quantity}}</view></view><view class="Shopping-title" v-if="total_quantity > 0">已点{{total_quantity}}份菜品</view><view class="place-order" @click.stop="total_quantity == 0 ? false : true && placean_order()"><button plain="true" open-type="getUserInfo">选好了</button></view></view></view><!-- 购物车 --><Cart @empty_data="channel" @shopping_Cart_add_sub="channel" @close="pop_Shopping" v-if="card" :otherList="otherList" :shopping_card="shopping_card"></Cart><!-- 引入单个商品弹出 --><Details @reduce="channel" @plus="channel" @popup_item="popup_item" v-if="popupitem" :pro_details="pro_details"></Details><!-- 骨架屏 --><Home v-if="exist"></Home><!--    <input v-model="value" placeholder="请输入您的id" /><input v-model="valueB" placeholder="请输入您发送的id" /> --><!-- <button @click="onload()">确定</button> --><!-- <button @click="returnClick">发送</button> --></view>
</template>

订阅消息

//订阅消息goEasy.pubsub.subscribe({channel: "test_channel",//替换为您自己的channelonMessage: (message) => { //收到消息let obj = JSON.parse(message.content)// obj.data[3].uid = obj.uidthis[obj.fun](...obj.data)// if(this.userId !== obj.uid) {//   this.otherList = obj.shopList//    if(this.otherList.length <= 0) {//      this.otherList = [obj.data[3]]//   }// } else {// }console.log("Channel:" + message.channel + " content:" + message.content);},onSuccess: function () {console.log("Channel订阅成功。");},onFailed: function (error) {console.log("Channel订阅失败, 错误编码：" + error.code + " 错误信息：" + error.content)}});

发送消息

 //发送
channel(fun,data) {console.log('uni.getSystemInfoSync()-------',uni.getSystemInfoSync())//发送goEasy.pubsub.publish({channel: "test_channel",//替换为您自己的channelmessage: JSON.stringify({fun:fun,uid:this.userId,shopList:this.shopping_card,data:data}),//替换为您想要发送的消息内容onSuccess:res => {console.log("消息发布成功。");},onFailed: function (error) {console.log("消息发送失败，错误编码："+error.code+" 错误信息："+error.content);}})
}

项目预览

git：https://gitcode.net/qq_27161847/goEasy.git

使用goEasy实现多对多实时点餐程序相关推荐

node mongoose_如何使用Express，Mongoose和Socket.io在Node.js中构建实时聊天应用程序
node mongoose by Arun Mathew Kurian 通过阿伦·马修·库里安(Arun Mathew Kurian) 如何使用Express,Mongoose和Socket.io在N ...
iftop是一个很好用的实时流量监测程序，跟使用iftop查看linux连接进程占用的实时流量...
iftop是一个很好用的实时流量监测程序,跟top命令监测cpu内存等差不多官方地址:http://www.ex-parrot.com/~pdw/iftop/ 安装方法: yum install - ...
用python编写一个点餐程序_Python写一个自动点餐程序
原博文 2019-08-09 10:45 − # Python写一个自动点餐程序 ## 为什么要写这个公司现在用meican作为点餐渠道,每天规定的时间是早7:00-9:40点餐,有时候我经常容易忘 ...
[转载]实时 Java，第 5 部分: 编写和部署实时 Java 应用程序
实时 Java,第 5 部分: 编写和部署实时 Java 应用程序 2007 年 7 月 11 日这篇文章是讨论实时 JavaT™ 的 6 部分系列文章的第 5 部分,展示了如何使用 IBM W ...
2022外卖霸王餐程序、外系统霸王餐H5/APP程序源码|美团/饿了么霸王餐系统粉丝裂变自带账单在线支付提现等
2022外卖霸王餐程序.外系统霸王餐H5/APP程序源码|美团/饿了么霸王餐系统粉丝裂变自带账单在线支付提现等外卖霸王餐系统程序/H5/APP源码 2022最新霸王餐程序霸王餐程序/H5/A ...
股市资深大牛用Python写了个股票价格实时MacOS应用程序！实时监控！
导言虽然Python很适合构建很多东西,但MacOS应用程序肯定不是其中之一.我想知道是否可以使用Python为MacOS构建菜单栏应用程序.我发现这不仅是可能的,而且"非常简单" ...
Oracle JDE 财务实时对账程序概览
JDE财务实时对账程序概览交互式完整性检查程序使您能够通过实时财务对账即时识别潜在的财务完整性问题,而无需等待评估批处理的结果: 实时财务对账应用程序允许您: 通过查找和解决完整性问题而无需等待报告 ...
实现北京公交实时预警小程序
实现北京公交实时预警小程序北京的天冷的太快,在后厂村的公交站台冻的要死要活几年之后,终于决定动手写个公交到站时间预报的程序,以便能舒服坐在工位等我的公交车. 美好想法是:当我处在公司累死累活加班以致 ...
Javascript | 模拟mvc实现点餐程序
MVC模式是一个比较成熟的开发模式.M是指业务模型,V是指用户界面,C则是控制器,使用MVC的目的是将M和V的实现代码分离,从而使同一个程序可以使用不同的表现形式.其中,View的定义比较清晰,就是用 ...

使用goEasy实现多对多实时点餐程序

使用goEasy实现多对多实时点餐程序

使用goEasy实现多对多实时点餐程序相关推荐

最新文章

热门文章