微信小程序笔记,持续更新中...

1.微信小程序 view、text内英文数字不换行

设置word-break:break-all;

遇到场景:wxParser-plugin插件纯数字不换行,例如:123874962138462871946219346137463128946321647823462894612的

不论设置多宽,数字一行,‘的’一行

2.获取自定义组件为null:this.selectComponent('#id');

一定要在json的usingComponents里添加组件

3.在textare文本输入框频繁切换时,focus设置有时好使,有时不好使。

1.focus的true和false是成对出现的。设置了ture后,要有false。有时键盘的状态和focus状态对应不上,会造成不好使

2.在两个页面都需要键盘,在第二个页面跳转回第一个页面之前,要手动设置第二个页面的focus为false。不然第一个页面的键盘会出问题

this.setData({ focus:false });

wx.navigateBack({delta: 1 })

4.小程序内图片是webp格式,iOS不显示,尤其是wxparser中。

例如:https://mmbiz.qpic.cn/mmbiz_png/RKXPwqBsMlj0OonVtc0aHsKnYVwdr2muHeurgFKqPoW4xxDHGia3O4FTqkLiaB920ZoSktGFhh9BHCdcrrxDeYPg/640?wx_fmt=png&tp=webp&wxfrom=5&wx_lazy=1&wx_co=1

暴力方法:手动删掉webp

5.overflow: hidden有时不好使

设置display:block

6.flex row 中有image和view,image宽度不好使

image设置flex-shrink:0;

7.css设置2行,截取显示字符串

display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
word-wrap: break-word;
white-space: normal !important;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;

8.flex布局 space-between,最后一行左对齐

after伪元素item宽和其他一样,高为0进行占位

.container:after{
 content: ""; 
 width: 其他item宽度; 
 display: block; 
 height:0; 
}

9.z-index只能在position属性值为relative或absolute或fixed的元素上有效。

原创声明,本文系作者授权云+社区发表,未经许可,不得转载。

如有侵权,请联系 yunjia_community@tencent.com 删除。

编辑于

我来说两句

0 条评论
登录 后参与评论

扫码关注云+社区

领取腾讯云代金券