VUE移动端一些注意点

1. 取消a标签在点击时的背景颜色

参考文章 https://blog.csdn.net/weixin_41076513/article/details/79804722

a {
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
    -webkit-user-select: none;
    -moz-user-focus: none;
    -moz-user-select: none;
}

2.  引入了mint-ui组件但是使用组件的时候会找不到

参考文章 https://www.cnblogs.com/stella1024/p/7771334.html

需要在 main.js 下全局引用 mint-ui

VUE移动端一些注意点_第1张图片   

 3. 搜索功能 监听输入框实时反馈数据

https://www.cnblogs.com/pengshengguang/p/8059190.html

@input="searchKey"

    searchKey () {
      this.clearTimer();
      if (this.keyWords && this.keyWords.length > 0) {
        this.timer = setTimeout(() => {
          this.listData = []
          this.pageNo = 0
        }, 500)
      } else {
        this.listData = []
      }
    },

4. 类型转换

https://www.cnblogs.com/vanl/p/5466670.html

sessionStorage缓存数据的时候会有类型问题

5. 获取滚动条高度以及设置滚动条高度

vue会自动记住滚动条的位置

6. 设置textarea不能拉伸

style="resize:none" 

7. vue移动端底部tab会被顶上去

https://www.jianshu.com/p/eeea79bd417d

当输入框聚焦的时候隐藏 底部tab,失焦的时候显示

8. 数字换行

word-wrap:break-word

9. input聚焦清除边框高亮

outline:none

10. 输入框放入图标

https://blog.csdn.net/chengQunBin/article/details/78505654

background: url("../assets/search.svg") no-repeat scroll left center #F3F4F8;

background-size: 30px 30px;  //大小

background-position: 20px;  //定位

11. 正则表达式集合

https://492664447-qq-com.iteye.com/blog/1534301

https://blog.csdn.net/dotphoenix/article/details/80076579

12. 隐藏滚动条 

.box::-webkit-scrollbar {
   display: none;
}

 

你可能感兴趣的:(VUE移动端一些注意点)