在线咨询
QQ咨询
服务热线
服务热线:13125520620
TOP

微信小程序小结02-- 完整的demo

发布时间:2018-7-4 浏览:3367

小程序确实方便,在移动端方便小个体宣传,不需要服务器和域名,还有客服功能。按朋友的意思,做了一次调整,分成了首页、预约和我的三个页面。
 
 
 
下面说下遇到的几个问题。
 
01.客服功能
 
不得不说这个一条龙服务的功能挺好的,帮住小店主开辟了一个客源路径,节省了开发的成本。只需要在页面里,放置一个contact-button就可以
 
   <contact-button   type="default-light"  size="20"  session-from="weapp" >客服 </contact-button> 
只是这个button的样式不好修饰,还自带图标。不喜。就可以换成button。
 
 <button class="cs_button"   open-type="contact"  
  session-from="weapp">客服</button > 
设置类型为contact就好。这样用户点击就能进入客服会话页面,
 
 
 
在用户的微信聊天记录中会出现新的一栏:小程序客服消息
 
 
 
 
 
然后在小程序后台设置客服人员,在指定的pc页面上扫码登录就能接入会话了。 客服地址:https://mpkf.weixin.qq.com/cgi-bin/kfindex
 
 
 
可惜这个地址不能在手机上用,如果可以集成到客服人员的用户里面最好了。在pc的网页上是比较麻烦的,因为小店主自己也不会一直在那登录,如果手机上收到消息能提示最好了,不然就很鸡肋。另外客服需要先在小程序后台绑定客服人员,注意如果微信设置了不能搜索,到这个地方也是搜不到的。
 
02.获取用户登录信息
 
这个功能一开始是好的,过了几天不知道怎么就获取不到用户信息了。然后按照文档意思,需要让用户再次点击button授权才可以。
 
复制代码
<view wx:if="{{isAuth}}" class="container short">
    <view class='avatar-box'>
    <image class="user-avatar"  src="{{ userInfo.avatarUrl }}"  />
    </view>
    <text class="title">{{ userInfo.nickName }}</text>
</view>
 <button  wx:if="{{!isAuth}}"  open-type="getUserInfo">授权登录</button>
复制代码
isAuth是加载的时候判断有没有 res.authSetting['scope.userInfo'] 这个权限,没有就为false。这样才能再次获取用户信息。
 
03.图片自适应
 
一开始在页面怎么调整css,图片的宽高比都失真,无奈之余去看了才晓得,这个居然也有暗门。
 
<image class="img" bindtap="previewImage" src="images/actv.jpg" mode="widthFix">
需要加上mode才能自适应。这真是伤悲,为啥不是默认配置。
 
04.拨打电话
 
  call:function(){
    wx.makePhoneCall({
      phoneNumber: phone 
    })
  },
这个功能实用,直接跳转到用户手机拨打电话的界面。
 
05.页面后退的问题
 
在页面导航的时候,非tarbar页面我们希望能够有个回退键,其实这是默认的。用navigator标签就好。
 
<navigator  url="/pages/location/location"  >
  <image class='icon s' src='../../images/w1.png'></image> 
  门店位置</navigator>
但我一开始拿来代码的时候傻逼了,navigator(相当于是a标签) 加了一个redirect的。结果就是又去无回...
 
小结:开发这种纯展示的不需要域名和服务器,这是快哉。另外就是阿里的这个图标用的很爽。
 
 

TAG
软件定制,软件开发,瀚森HANSEN,辽宁,沈阳,抚顺
0
该内容对我有帮助