之前学习使用uni-app简单实现一个在线聊天的功能，今天记录一下项目核心功能的实现过程。页面UI以及功能逻辑全部来源于微信，即时聊天业务的实现使用socket.io，前端使用uni-app开发，后端服务器基于node实现，数据库选择mongoDB。首先在系统中注册两个用户，将对方添加为好友后，开始正常聊天，先简单看一下聊天功能的效果图，分为私聊和群聊两大部分一对一聊天效果：在好友列表中添加群成员创建群后即可群聊，群聊效果：目录聊天信息列表的渲染聊天信息发送的相关问题实现一对一聊天关于websocket建立连接存储连接的用户发送聊天信息 首页新消息提示实现群聊加入房间发送群消息聊天信息列表的渲
之前学习使用uni-app简单实现一个在线聊天的功能，今天记录一下项目核心功能的实现过程。页面UI以及功能逻辑全部来源于微信，即时聊天业务的实现使用socket.io，前端使用uni-app开发，后端服务器基于node实现，数据库选择mongoDB。首先在系统中注册两个用户，将对方添加为好友后，开始正常聊天，先简单看一下聊天功能的效果图，分为私聊和群聊两大部分一对一聊天效果：在好友列表中添加群成员创建群后即可群聊，群聊效果：目录聊天信息列表的渲染聊天信息发送的相关问题实现一对一聊天关于websocket建立连接存储连接的用户发送聊天信息 首页新消息提示实现群聊加入房间发送群消息聊天信息列表的渲
总体思路其实跟H5的无差；获取当前抛物线起始位置的坐标获取购物车图标的坐标通过创建一个图标从起始坐标点到终止坐标点的动画效果（延时一秒），这样就造成一个抛物线的假象了。上代码：其中animationElStatus是需要动态计算起始及终止坐标点位置后的动态样式。此html样式，会在每次点击加入购物车时，动态写入style后触发，将img掉入购物车位置注意这里的变量animationElStatus，使用模板字符串连接时，不能折行，不能忘记分号隔开样式this.animationElStatus=top:${endPoint.top}px;left:${endPoint.left}px;tran
总体思路其实跟H5的无差；获取当前抛物线起始位置的坐标获取购物车图标的坐标通过创建一个图标从起始坐标点到终止坐标点的动画效果（延时一秒），这样就造成一个抛物线的假象了。上代码：其中animationElStatus是需要动态计算起始及终止坐标点位置后的动态样式。此html样式，会在每次点击加入购物车时，动态写入style后触发，将img掉入购物车位置注意这里的变量animationElStatus，使用模板字符串连接时，不能折行，不能忘记分号隔开样式this.animationElStatus=top:${endPoint.top}px;left:${endPoint.left}px;tran
需求：点击按钮获取当前微信位置，以及点击拒绝授权后，下次点击还可以拉起授权窗口；拒绝授权后重新拉起授权操作：直接授权操作：一、问题1：报authorizescope.userLocation需要在app.json中声明permission字段；原因：因为微信小程序从2019年1月14日起新提交发布的版本若未填写地理位置用途说明，则将无法正常调用地理位置相关接口；解决办法：在manifest.json文件中，mp-weixin属性下配置permission获取地理位置的权限代码如下：直接复制黏贴对应位置即可"permission":{//获取当前的地理位置、速度配置"scope.userLoca
需求：点击按钮获取当前微信位置，以及点击拒绝授权后，下次点击还可以拉起授权窗口；拒绝授权后重新拉起授权操作：直接授权操作：一、问题1：报authorizescope.userLocation需要在app.json中声明permission字段；原因：因为微信小程序从2019年1月14日起新提交发布的版本若未填写地理位置用途说明，则将无法正常调用地理位置相关接口；解决办法：在manifest.json文件中，mp-weixin属性下配置permission获取地理位置的权限代码如下：直接复制黏贴对应位置即可"permission":{//获取当前的地理位置、速度配置"scope.userLoca
在近期做得一个小程序里要展示当地天气情况，这也就意味着要获取当前位置信息，小程序这边需要getLocation来向用户发起弹窗申请授权获取位置信息。就像下面这样：不过呢，现在的getLocation()只能获取到用户当前位置的经度、纬度.......又让我回想起高一时那个地理我刚及格的成绩，咱得把经纬度再转成位置才行（因为我的后端是根据省市区来进行天气获取的，而不是经纬度，就像"北京市-北京市-海淀区"），也就是：逆地址解析查资料后发现要用【腾讯位置服务】，这个东西可以给我们提供上面的功能——逆地址解析。实现步骤：1、到【自己的小程序】后台申请开通位置服务（登录微信公众平台-小程序-开发-开发
在近期做得一个小程序里要展示当地天气情况，这也就意味着要获取当前位置信息，小程序这边需要getLocation来向用户发起弹窗申请授权获取位置信息。就像下面这样：不过呢，现在的getLocation()只能获取到用户当前位置的经度、纬度.......又让我回想起高一时那个地理我刚及格的成绩，咱得把经纬度再转成位置才行（因为我的后端是根据省市区来进行天气获取的，而不是经纬度，就像"北京市-北京市-海淀区"），也就是：逆地址解析查资料后发现要用【腾讯位置服务】，这个东西可以给我们提供上面的功能——逆地址解析。实现步骤：1、到【自己的小程序】后台申请开通位置服务（登录微信公众平台-小程序-开发-开发
前情回顾从零开始搭建SpringBoot项目(一)——开发环境搭建从零开始搭建SpringBoot项目(二)——Swagger接口测试平台搭建目录前情回顾一、前置条件二、本篇介绍三、获取小程序AppID和密钥四、创建小程序项目五、UNI-APP框架介绍六、初识uni-app项目1、uni-app项目创建出来之后，目录结构如下👇2、创建练习页面①在pages目录中创建demo页面👇②在pages.json文件中，把demo页面设置为第一个页面③编写demo.vue文件④运行项目之前，先设置小程序调试基础库为最新七、创建登录注册页面1、拷贝所有素材文件2、创建登陆注册页面八、如何获取微信账号的Op
前情回顾从零开始搭建SpringBoot项目(一)——开发环境搭建从零开始搭建SpringBoot项目(二)——Swagger接口测试平台搭建目录前情回顾一、前置条件二、本篇介绍三、获取小程序AppID和密钥四、创建小程序项目五、UNI-APP框架介绍六、初识uni-app项目1、uni-app项目创建出来之后，目录结构如下👇2、创建练习页面①在pages目录中创建demo页面👇②在pages.json文件中，把demo页面设置为第一个页面③编写demo.vue文件④运行项目之前，先设置小程序调试基础库为最新七、创建登录注册页面1、拷贝所有素材文件2、创建登陆注册页面八、如何获取微信账号的Op
