【新手自用龟速更新中】前端+微信小程序学习日志

本文是作者的前端学习日志，包括多行省略的CSS实现、request封装与请求加载提示、解构赋值和扩展运算符的应用。文章计划还将涉及CSS选择器、Less语法、Python数据上传至微信云开发数据库等内容。

不知不觉搞了一地鸡毛算法之前写了不少
但寒假结束后基本停了现在也忘光了
总想写写算法的题解毕竟csdn上想找个通俗易懂的题解很不容易，复制粘贴别人的代码是多数，格式乱，粘不全，注释没有，或者就写个水题就把代码丢上去，对于我这类理解苦手新人很不友好
(特别是以前逆波兰式的题，没学离散前不是很懂，代码也没解释)
日志这种东西很久没写了这段时间还是写写吧

1.多行省略

以前都是用text-overflow搭配别的但总有难处理的情况

text-overflow:ellipsis

看了下蛋老师的讲解，学到许多
参考：CSS多行省略–蛋老师
方法1:私有属性

.p {
	overflow:hidden;
	display: -webkit-box;	//自适应布局 设置盒子内部元素排列方向
	-webkit-box-orient: vertical; //方向为垂直
	-webkit-line-clamp: 4;	//文本高度显示四行
}

方法2：双重伪元素遮挡

p {
	overflow: hidden;
	position: relative;
	padding-right: 1em;	//为省略号增加空间
	text-align: justify; //文本两端对齐
}
p::before {
	content: "...";
	position: absolute;
	right: 0;
	bottom: 0
}
p::after {
	content: "";
	background: #eee;
	width: 1em;
	height: 1em;
	position: absolute;
	display: inline;
	right: 0;
	margin-top: 0.5em;
}

上面文本两端对齐也挺重要的，刚开始学的时候总是忘记
伪元素默认是行内元素
方法3就不写了类似方法二但是以渐变遮挡自己建站时可以用用

2.封装request+请求时提示加载

let ajaxTimes=0
export const request=(params)=>{ 
  ajaxTimes++
  wx.showLoading({
    title: '加载中',
    mask:true
  })
  const baseUrl = 'url'
    return new Promise((resolve,reject)=>{
        wx.request({
          ...params,
          url:baseUrl+params.url,
          success:(result)=>{
            resolve(result.data.message)
          },
          fail:(err)=>{
            reject(err)
          },
          complete:()=>{
            ajaxTimes--
            if(ajaxTimes===0){
              wx.hideLoading()
            }
          }
        })
    })
}

封装的好处是配合ES7的async和await只需要填入url和data等就可以请求数据（第一次使用需要在右上角详情里打开增强编译!）
对于请求多次时使用ajaxTimes来避免第一次请求完成就隐藏加载框
需要注意的是现在已经自带有onPullDownRefresh和onReachBottom了
如果写的时候没有效果检查下下方是否已经有这两个监听函数
有弹幕说类似防抖和节流？
晚些我再去了解下这部分知识