小程序填坑实录

[复制链接]
查看: 3768|回复: 3
  • 萌哒
    2018-11-19 14:03
  • 发表于 2019-1-23 11:28:58 | 显示全部楼层 |阅读模式

    马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

    您需要 登录 才可以下载或查看,没有帐号?立即注册

    x
    open-data头像如何设置样式


    • 设置成 { display: block; overflow: hidden; } 就可以正常设置样式了,包括圆形头像等
    小程序中使用Promise


    • 引用npm中的es6-promise即可;
    • 使用下面的函数包裹微信API即可将其转为Promise方式调用:
    function promise(fn) { return function (obj = {}) { return new Promise((resolve, reject) => { obj.success = res => resolve(res); obj.fail = res => reject(res); fn(obj); }) }}...调用方式:utils.promise(wx.request)({ url: ... }).then(response => { ... }) ...纯CSS方式给元素添加半透明背景

    .elem { /* 元素本身添加样式 */ position: relative; /* 为了后面的伪元素以本元素为定位基准 */ z-index: 10; /* 渲染在伪元素之上 */ /* 其它样式,大小,字体等 */}.elem::after { /* 给元素添加::after伪元素并设置为半透明:*/ content: ""; position: absolute; left: 0; background-color: white; opacity: 0.2; /* 其它样式,大小应和主元素一致 */}开发阶段给所有元素添加虚线边框


    • 小程序WXSS似乎不支持"*"选择器,因此只能用以下笨办法:
    /* 仅供测试,发布版请删除 */view,icon,text,rich-text,progress,image,button,textarea,open-data,navigator,canvas,checkbox,form,input,label,picker,radio,slider,switch { outline: 1px dashed lightblue;}渐变背景


    • 为了在开发工具生效,需要使用"-webkit-"前缀:
    .mainbg { background: -webkit-linear-gradient(left,#18b6ff,#aa29ff); background: linear-gradient(left,#18b6ff,#aa29ff);}占据垂直方向的剩余空间


    • 使用CSS的calc函数
    { height: calc(100vh - 300rpx); }让小程序支持服务端Session


    • 主要就是要添加Cookie支持,可以包装一下wx.request方法实现
      1) 解析response的Set-Cookie应答头,并将cookie保存在本地
      2) 以后每次请求把本地保存的cookie放到Cookie请求头中
    点击用户头像跳转页面


    • open-data上面不能绑定事件,简单实现可以用navigator包裹open-data,不用写js代码即可实现点击跳转页面;
    • navigator相当于html的a元素,默认为inline,可修改display样式为block
    发表于 昨天 05:47 | 显示全部楼层
    我只是路过打酱油的
    回复

    使用道具 举报

    发表于 昨天 05:47 | 显示全部楼层
    确实是难得好帖啊,顶先
    回复

    使用道具 举报

  • 无聊
    2018-4-21 21:10
  • 发表于 昨天 11:19 | 显示全部楼层
    回的人少,我来小顶一下
    回复

    使用道具 举报

    您需要登录后才可以回帖 登录 | 立即注册

    本版积分规则

     
     
    技术支持
    在线客服
    售后交流群瑞恩社区™售后</font><br><span>交流
    工作时间:
    8:00-18:00
    客服热线:
    15368564009
    微信扫一扫
    返回顶部 关注微信 下载APP 返回列表