原创内容,转载请注明原文网址:http://homeqin.cn/a/wenzhangboke/jishutiandi/weixinkaifa/2019/0103/304.html
常州微信小程序-顶部提示,canvas,webSocket




webSocket示例代码:
[AppleScript] 纯文本查看 复制代码
|
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
|
// pages/index/index.jslet app = getApp();let socketOpen = false;let inputValue = "";Page({ data:{ thevalue: "", msglist : [] }, onLoad:function(options){ const that = this; app.getUserInfo(function(userInfo){ //常州微信公众平台更新数据 that.setData({ userInfo:userInfo }) //链接 wx.connectSocket({ url: 'ws://www.flydiv.com:8888/', data:{ nickName: that.data.userInfo.nickName, avatarUrl: that.data.userInfo.avatarUrl }, header:{ 'content-type': 'application/json' }, method:"GET" }); //打开' wx.onSocketOpen(function(res) { socketOpen = true console.log("------open-----") }) //接收 wx.onSocketMessage(function(data) { that.data.msglist.push(JSON.parse(data.data)); inputValue = ""; that.setData({ thevalue: "", msglist : that.data.msglist }) console.log("------onmsg-----") }) }) }, input : function(e){ inputValue = e.detail.value }, send : function(e){ const that = this; if((e.detail.value || inputValue) == ""){ return; } if(socketOpen){ wx.sendSocketMessage({ "data" : JSON.stringify({ "content" : e.detail.value || inputValue, "avatarUrl" : that.data.userInfo.avatarUrl }) }) }else{ wx.showToast({ icon : "loading", title : "常州网站开发建设未打开WS!" }) } }}) |
[AppleScript] 纯文本查看 复制代码
|
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
|
<view id="maininpitbox"> <input id="maininpit" type="text" bindconfirm="send" bindinput="input" value="{{thevalue}}"/> <view class="sendbtn" bindtap="send"> send </view></view><view class="content"> <!-- 群消息[包括我的消息] --> <block wx:for="{{msglist}}"> <view class="msgbox {{item.avatarUrl==userInfo.avatarUrl?'mymsg':''}}"> <view class="portrait"> <image src="{{item.avatarUrl}}"></image> </view> <view class="msg"> {{item.content}} </view> </view> </block></view> |
上篇:上一篇:常州微信小程序-canvas绘制地图和简单拖动
下篇:下一篇:常州游戏开发培训-微信小程序-动手Flypy Bird



