小程序中当rich-text中数据较多时就会出现溢出的现象 如下

此时的页面效果并不是很理想 我们可以在数据中给个div

<div style="overflow: hidden;white-space: nowrap;text-overflow: ellipsis">55555555555555555555555555555555555</div>

加入  overflow: hidden;　　white-space: nowrap;　　text-overflow: ellipsis;三个属性解决溢出问题

但这不是很好，如果数据从后台来 上面方法就需要变通一下

如下

<rich-text nodes="<div style='overflow:hidden;white-space:nowrap;text-overflow:ellipsis;'>{{html}}</div>" bindtap="tap"></rich-text>

直接在nodes中包一个div给上属性，这样的话不管后台传的是什么，只要溢出都会显示三个点

微信小程序中rich-text文本溢出（三个...）的更多相关文章

  1. 在微信小程序中使用富文本转化插件wxParse

    在微信小程序中我们往往需要展示一些丰富的页面内容,包括图片.文本等,基本上要求能够解析常规的HTML最好,由于微信的视图标签和HTML标签不一样,但是也有相对应的关系,因此有人把HTML转换做成了一个 ...

  2. 去除富文本中的html标签及vue、react、微信小程序中的过滤器

    在获取富文本后,又只要显示部分内容,需要去除富文本标签,然后再截取其中一部分内容:然后就是过滤器,在微信小程序中使用还是挺多次的,在vue及react中也遇到过 1.富文本去除html标签 去除htm ...

  3. 微信小程序中显示html富文本的方法

    微信小程序中显示html富文本的方法 使用方法:git地址:https://github.com/icindy/wxParse 一.下载wxParse文件 二.在要引入的页面的js文件中,引入文件 j ...

  4. 微信小程序中转义字符的处理

    在微信小程序开发过程中,有时候会用到常用的一些特殊字符如:‘<’.‘>’.‘&’.‘空格’等,微信小程序同样支持对转义字符的处理,下面提供两种方法用来处理微信小程序中转义字符的处理 ...

  5. 全栈开发工程师微信小程序-中(下)

    全栈开发工程师微信小程序-中(下) 微信小程序视图层 wxml用于描述页面的结构,wxss用于描述页面的样式,组件用于视图的基本组成单元. // 绑定数据 index.wxml <view> ...

  6. 微信小程序中的组件使用1

    不管是vue还是react中,都在强调组件思想,同样,在微信小程序中也是使用组件思想来实现页面复用的,下面就简单介绍一下微信小程序中的组件思想. 组件定义与使用 要使用组件,首先需要有组件页面和使用组 ...

  7. 全栈开发工程师微信小程序-中(中)

    全栈开发工程师微信小程序-中(中) 开放能力 open-data 用于展示微信开放的数据 type 开放数据类型 open-gid 当 type="groupName" 时生效, ...

  8. 微信小程序中target与currentTarget

    target在事件流的目标阶段:currentTarget在事件流的捕获,目标及冒泡阶段.但事件流处于目标阶段,target与currentTarget指向一样, 而当处于捕获和冒泡阶段的时候,tar ...

  9. 微信小程序中使用阿里字体图标

    在微信小程序中使用阿里字体图标 ,不通过转换成base64的方式实现. 为了美化微信小程序,可以适当的使用一些小图标,这样体验也更友好些,于是决定使用常用的字体图标. 下载图标 首先在阿里字体图标查找 ...

  10. 如何在微信小程序中使用字体图标

    微信小程序中,在image标签里,可以在src中引用本地文件,但是background设置背景图或者使用字体图标的时候,却不能引用本地文件,只能用url地址的图片或字体,或者使用base64编码后的格 ...

随机推荐

  1. js 手动实现bind方法，超详细思路分析！

    壹 ❀ 引 在 js 实现call和apply方法 一文中,我们详细分析并模拟实现了call/apply方法,由于篇幅问题,关于bind方法实现只能另起一篇. 在模拟bind之前,我们先了解bind的 ...

  2. 源码剖析Spring依赖注入：今天你还不会，你就输了

    在之前的讲解中,我乐意将源码拿出来并粘贴在文章中,让大家看一下.然而,我最近意识到这样做不仅会占用很多篇幅,而且实际作用很小,因为大部分人不会花太多时间去阅读源码. 因此,从今天开始,我将采取以下几个 ...

  3. NC17871 CSL分苹果

    题目链接 题目 题目描述 CSL手上有n个苹果,第i个苹果的质量是wi,现在他想把这些苹果分给他的好朋友wavator和tokitsukaze.但是CSL为了不让他们打架,根据质量决定尽量地均分成两堆 ...

  4. 使用JS访问本地数据库

    1 前言 有时候,数据业务比较大,比如查询百万级的数据,如果使用JSP查询数据库,JSP的返回结果一般放在域名后面返回给客户端,而返回结果的长度是有限制的,数据过长可能会丢失部分数据:另一方面数据量大 ...

  5. 【Android】使用ContentProvider实现跨进程通讯

    1 前言 ​ ContentProvider 即内容提供器,是 Android 四大组件之一,为 App 存取数据提供统一的对外接口,让不同的应用之间可以共享数据. ​ 如图,Server 端通过 C ...

  6. CSS加JS实现网页返回顶部功能

    最近在设计自己的博客,前端页面在内容很多的时候往下拖动会有滚动条.通常我们都需要一个返回顶部的功能来实现快速来到网页顶部.当然实现方式不止一种,这里我采用的最实用的一种.使用CSS+Jquery方式 ...

  7. std::async 与 std::thread 在什么时候使用比较合适

    前提: C++ 11 中提供了多线程的标准库,提供了管理线程.保护共享数据.线程间同步操作.原子操作等类.多线程库对应的头文件是 #include <thread>,类名为 std::th ...

  8. 异常处理之raise A from B

    raise A from B 语句用于连锁chain异常 from 后面的B可以是: - 异常类 - 异常实例 - None 如果B是异常类或者异常实例,那么B会被设置为A的__cause__属性,表 ...

  9. ubantu中安装redis及遇到的问题

    安装命令 sudo apt-get install redis-server 开启远程连接 找到vi /etc/redis/redis.conf文件修改如下 bind 127.0.0.1 为 0.0. ...

  10. vue upload 图片转base64、转二进制数组，保存编码数据到文件

    功能需求 1.图片转base64 2.base 64 转二进制数组 3.保存二进制数据到文件下载到本地 解决方法 问题1: 参考资料 vue element upload图片 转换成base64 具体 ...