美文网首页
微信小程序 日常开发问题整理

微信小程序 日常开发问题整理

作者: 奇董 | 来源:发表于2018-01-04 18:27 被阅读30次

    备份
    web 业余选手

    1.获取屏幕宽高

    .css{
    width: 100vw; //屏幕等宽
    height: 100vh;
    }
    
    wx.getSystemInfoSync().windowHeight
    

    2.顺序网络请求

    1.嵌套

    requestNetworking1(function(){
        //请求1
        requestNetworking2(function(){
        //请求1
        
        })
    })
    
    

    2.Promise

    function requestNetworking1(){
      return new Promise(function(reslove,reject){
        wx.request({
            success: function(res){
              reslove(res)
          }
      })
    })
    }
    
    requestNetworking1().then(res => {
        requestNetworking2()  
    })
    

    感觉类型rx 的信号处理机制
    相关文章 https://www.jianshu.com/p/063f7e490e9a

    3横向 scrollerview

    不止需要设置 scroll-x
    css 中还要设置相关

    .scrollerview {
      white-space:nowrap;
    }
    .item {
     display: inline-block;
    }
    
    

    4 元素hidden 失灵

    权重问题
    官方给的解释


    image.png

    1

    元素尽量避免dispaly
    

    2

    style="dispaly:none"
    

    css

    1.多label 中间有间隙
    label display属性为inline
    行内元素独有一个空格的间距
    解决办法
    1-1

    inline 改为blcok
    

    1-2

    父元素 font-size: 0px; 
    

    2

    =============1.10更新============

    1.通知

    遇到一个需求
    tab: a b
    nav: a1 ----> (nav) a2
    a2 更新数据之后
    同页面栈的a1也要更新
    而且 tab页面栈的b 也要更新

    这就很烦了 同页面栈的a1 我们能通过getCurrentPages()获取到

    Andriod和iOS 都有通知可以处理这方面的业务。小程序没有提供相关api
    自己手动写一个

    class Observer {
      constructor(name, observer, selector, block) {
        this.name = name
        this.observer = observer
        this.selector = selector
        this.block = block
      }
    }
    
    class NotificationCenter{
      constructor(){
    
      }
    
      addNotification(name,observer,selector,block){
        if(this.notis == null) {
          this.notis = new Array()
        }
    
        //观察者添加到通知中心中
        var ob = new Observer(name, observer, selector, block)
        //剔除重复观察者
        for(var index in this.notis) {
          var item = this.notis[index]
          if(item.name == name) { return }
        }
    
        this.notis.push(ob)
    
      }
    
      postNotification(name,args) {
        var notis = this.notis
        var observer = null
    
        for(var index in notis) {
          var item = notis[index]
          if(item.name == name) {
            observer = item
            break
          }
        }
    
        if(observer == null) { return }
    
        if(observer.selector != null) {
          observer.selector(args)
        }
    
        if (observer.block != null) {
          observer.block(args)
        }
    
      }
    removeNotification(name) {
        for (var index in this.notis) {
          var item = notis[index]
          if (item.name == name) {
            this.notis. splice(index,1)
          }
        }
      }
    }
    
    var center = new NotificationCenter()
    
    module.exports = center
    

    使用的时候
    发送通知

    import center from '../../NotificationCenter.js'
    center.postNotification('notification', { name: "嘿嘿" })
    

    接受方

    var that = this
        center.addNotification('notification',that,null, function(args){
          console.log('-------')
          console.log(args)
          console.log('-------')
        })
    
    

    可选回调方法 和 指定方法名 都是可选的

    相关文章

      网友评论

          本文标题:微信小程序 日常开发问题整理

          本文链接:https://www.haomeiwen.com/subject/aufdnxtx.html