未解决的bug----

镰刀布局

需要看一下bootstrap 12分栏或者 element 24分栏源码

Video组件 自动播放的兼容问题 controls黑边问题

<audio preload="preload" controls id="car_audio" src="http://media.xitaoinfo.com/ei_zamenjiehunba.mp3" loop></audio> 
<video id="video" controls="" preload="none" mediagroup="myVideoGroup" poster="http://media.w3.org/2010/05/sintel/poster.png"> 
      <source id="mp4" src="http://media.w3.org/2010/05/sintel/trailer.mp4" type="video/mp4"> 
      <source id="webm" src="http://media.w3.org/2010/05/sintel/trailer.webm" type="video/webm"> 
      <source id="ogv" src="http://media.w3.org/2010/05/sintel/trailer.ogv" type="video/ogg"> 
      <p>Your user agent does not support the HTML5 Video element.</p> 
</video> 
<!-- 必须加载微信api资源 --> 
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script> 
<script> 
     //一般情况下，这样就可以自动播放了，但是一些奇葩iPhone机不可以 
     document.getElementById('car_audio').play(); 
    //必须在微信Weixin JSAPI的WeixinJSBridgeReady才能生效 
    document.addEventListener("WeixinJSBridgeReady", function () { 
        document.getElementById('car_audio').play(); 
        document.getElementById('video').play(); 
    }, false); 
</script>

安卓下唤出键盘页面抖动的问题

css文件过大

    **url-loader中的限制过大的话，会将图片一块合并至css文件中**

多选联动选择框的性能问题，常量的保存，可能存在的几种情形：全选，全不选，部分选。

toast的实现原理，element源码结合技术博客

修改computed中的数据下的第二层对象，页面不会重绘失败，set失效

移动端 安卓呼出导致可视区域改变的问题

 fixedKeyboard() {
              let that = this;
              var client_h = document.documentElement.clientHeight;
              window.addEventListener("resize", function() {
                if (/iphone|ipad/i.test(navigator.userAgent.toLowerCase())) {
                  //ios这块什么都不用做
                } else {
                  //安卓触发window.resize
                  var body_h = document.documentElement.clientHeight;
                  console.log(body_h, client_h);
                  if (client_h > body_h) {
                    console.log("ad小了");
                      that.addressRef.style.height = client_h +'px'

                    // that.keyBord_flag = false

                  } else {
                    // that.keyBord_flag = true

                    console.log("ad正常");
                  }
                }
              });
            },

移动端 手指滑动事件

 swiperHandle(){
      //禁止到下一页

      let that = this
      this.$nextTick(()=>{
        var startX, startY, moveEndX, moveEndY, X, Y;

        that.mybody.addEventListener('touchstart', function(e) {
            // e.preventDefault();
            startX = e.touches[0].pageX;
            startY = e.touches[0].pageY;
        }, false);

        that.mybody.addEventListener('touchmove', function(e) {
            // e.preventDefault();
            moveEndX = e.changedTouches[0].pageX;
            moveEndY = e.changedTouches[0].pageY;
            X = moveEndX - startX;
            Y = moveEndY - startY;
            if ( Math.abs(X) > Math.abs(Y) && X > 0 ) {
                // alert("向右");
            }
            else if ( Math.abs(X) > Math.abs(Y) && X < 0 ) {
                // alert("向左");
            }
            else if ( Math.abs(Y) > Math.abs(X) && Y > 0) {
                // alert("向下");
            }
            else if ( Math.abs(Y) > Math.abs(X) && Y < 0 ) {
                // alert("向上");
                if(Math.abs(Y) > 60){
                  console.log('翻页')
                  console.log('swiper')
                  console.log(that.IsCreate)

                  //判断链接是否有效
                  if(!that.IsCreate){
                    return
                  }

                  that.$refs.mychild.videoPlayHandle();
                  that.swiperClass()    
                  // that.show_choose()
                }
                // console.log("向上")
                console.log(Y)
            }
            else{
                // alert("没滑动");
            }
        });
        //
          }
        )
    },

函数的功能尽量单一, 并且利用好形参, 使函数具有复用性