微信小程序之多行文本省略号

最近在开发小程序,开发一个小组件,本来开发得差不多了,因为一个多行文本省略号的问题,拖了我一天啊(即使最后较好地解决了啊),可能是自己的开发经验不足导致了没能找到好的方案啊,把自己的经历写下来吧
一开始,我查了网上的各种资料,其实CSS就足以实现单行文本省略号和多行文本省略号(多行文本省略号主要针对的是-webkit-内核的浏览器,因为使用到的属性是webkit内核自带的一些私有属性,非此内核的用其他方案解决,但是针对微信小程序讲道理是可以用这些属性的啊),但是,的的确确,效果很差:
一开始是这样的:
.xxx {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 4;
overflow: hidden;
}
在chrome里面的效果是这样的啊:

确实没什么问题啊,但是一旦到了微信小程序,你就会发现大变样啊,变得你妈妈都不认识你啊.
想想算了,放弃了,调了半天也不见得好,打算改用js配合DOM的方式来,在编辑器里都已经把测试代码写好了,结果忘了那是微信小程序,我去,这就跟vuejs一样,操作DOM是一种笑话,尤其是在小程序里面,连标签都不一样,谁知道会有什么属性又怎么去获取.
后来,组长提醒了一下,微信小程序有访问DOM的接口,去官网看了一下,确实有一个createSelectorQuery()的方法,然后开始使用这个方法,以为这样就可以了,后来遇到异步问题用promise解决,解决了老半天发现,小程序的数据绑定渲染回页面的期间,获取元素