直播系统开发,简单的聊天对话窗口界面
直播系统开发,简单的聊天对话窗口界面
1.wxml代码:
<!-- 简单版 -->
<view class="scroll-list"><block wx:for="{{chatList}}" wx:for-index="index" wx:for-item="item" wx:key="item"><view wx:if="{{item.date}}" class="show-date">{{item.date}}</view><view wx:if="{{item.type=='custom'}}" class="row tips-text"><text>{{login.id==item.msgId?'你':item.nickname}}撤回了一条消息</text></view><view class="{{login.id==item.msgId?'row row-self':'row'}}" wx:else><view class="{{login.id==item.msgId?'head-self':'head-friend'}}"><image class="avatar" src="{{item.avatar}}"></image></view><view><view wx:if="{{login.id!=item.msgId}}" class="nick">{{item.nickname}}</view><view class="{{login.id==item.msgId?'message msg-self':'message msg-friend'}}"><text>{{item.message}}</text></view></view></view></block>
</view>
<!-- 发送信息 -->
<view class="footer"><view class="row"><view class="input-box"><textarea class="text-area" placeholder-class="placeholder" show-confirm-bar="{{false}}" cursor-spacing="30" maxlength="500"disable-default-padding="{{true}}"confirm-hold="{{true}}" hold-keyboard="{{true}}" auto-height="false" placeholder="输入信息" bindinput="inputClick" value="{{content}}"></textarea></view><view class="send-btn" wx:if="{{content!=''}}"><text class="send-text" bindtap="sendClick">发 送</text></view></view>
</view>
2.json代码:
{"usingComponents": {},"navigationBarTitleText": "聊天对话窗","navigationBarBackgroundColor": "#FF6347"
}
以上就是直播系统开发,简单的聊天对话窗口界面, 更多内容欢迎关注之后的文章
本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场,不承担相关法律责任。如若转载,请注明出处。 如若内容造成侵权/违法违规/事实不符,请点击【内容举报】进行投诉反馈!
