在普通的前端项目中，在不考虑兼容问题的时候，可以用以下代码实现：

overflow : hidden;

text-overflow: ellipsis;

display: -webkit-box;

-webkit-line-clamp: 2;

-webkit-box-orient: vertical;

但是在React项目之中不生效是因为在react编译后没有-webkit-box-orient: vertical;

解决方法是添加行内样式：

<p style={{"WebkitBoxOrient": "vertical"}}>

   React多行文本省略

</p>

React中多行文本省略不生效原因的更多相关文章

  1. [转]关于tomcat 中的 tomcat-users.xml 配置不生效原因

    安装完tomcat,或者解压完tomcat后,在tomcat的目录下有个conf文件夹,在这个文件夹下面有一个tomcat- users.xml的文件,这个文件里面的配置信息是当我们进入http:// ...

  2. React中setState的怪异行为 ——setState没有即时生效

    setState可以说是React中使用频率最高的一个函数了,我们都知道,React是通过管理状态来实现对组件的管理的,当this.setState()被调用的时候,React会重新调用render方 ...

  3. React中的路由系统

    React中的路由系统 提起路由,首先想到的就是 ASPNET MVC 里面的路由系统--通过事先定义一组路由规则,程序运行时就能自动根据我们输入的URL来返回相对应的页面.前端中的路由与之类似,前端 ...

  4. [Web 前端] mobx教程(三)-在React中使用Mobx

    copy from : https://blog.csdn.net/smk108/article/details/85053903 Mobx提供了一个mobx-react包帮助开发者方便地在React ...

  5. 在react中实现CSS模块化

    react中使用普通的css样式表会造成作用域的冲突,css定义的样式的作用域是全局,在Vue 中我们还可以使用scope来定义作用域,但是在react中并没有指令一说,所以只能另辟蹊径了.下面我将简 ...

  6. react 中发布订阅模式使用

    react 中发布订阅模式使用 场景 怎么能将设计模式应用到我们的 React 项目中?以前一直在思考这个问题. 场景一 模块 A 模块 B 需要用到同一个数据 data,A 和 B 都会修改这份数据 ...

  7. react中引入图片路劲正确但是页面上不显示或者打包后不能正常显示的问题

    一.react中图片引入方式 以前我们用img引入图片只需要如下即可,在react中这样写会报错: <img src="../assets/zzsc1.png" /> ...

  8. 理解React中es6方法创建组件的this

    首发于:https://mingjiezhang.github.io/(转载请说明此出处). 在JavaScript中,this对象是运行时基于函数的执行环境(也就是上下文)绑定的. 从react中的 ...

  9. 【原】React中,map出来的元素添加事件无法使用

    在使用react中,经常用到react的map函数,用法和jquery里中的map一样,但是,如果你在每个map出来的元素中添加,你会发觉添加的事件无法关联, 比如,我们很多的评论,我需要在每个评论下 ...

随机推荐

  1. sublime3 install python3

    链接地址:https://blog.csdn.net/Ti__iT/article/details/78830040

  2. 图片文字滚动插件jQuery Scrollbox

    图片文字滚动插件jQuery Scrollbox附件中提供了五种图片.文字滚动样式,只需调用jquery库和jQuery Scrollbox插件,然后再加一段简单的jquery代码即可使用,兼容性良好 ...

  3. Android 关于Toolbar和FragmentActivity的问题

    今天在工作中遇到用Fragment搭Tab框架时,FragmentActivity无法使用Toolbar的问题.查了许多资料,其实AppComponent继承自FragmentActivity,所以A ...

  4. WPF开发“Program '*' does not contain a static 'Main' method suitable for an entry point”错误

    WPF项目编译时出现“Program '*' does not contain a static 'Main' method suitable for an entry point”错误,   解决方 ...

  5. 深入理解DIP、IoC、DI以及IoC容器（转载）

    <转载的这个up的其他的文章也很nice> 这几个词第一眼看,懵逼,第二眼看,更特么懵逼..... 面向对象设计(OOD)有助于我们开发出高性能.易扩展以及易复用的程序. 其中,OOD有一 ...

  6. axis2 1.7.1使用教程

    写在前面 本文只说Axis2的用法. 1.下载与部署 需要下载两个文件: 下载地址:http://mirrors.cnnic.cn/apache/axis/axis2/java/core/1.7.1/ ...

  7. Spring AOP理解

    Spring的核心思想的IOC和AOP.最近学习AOP,对切面的学习有了进一步的认识. Spring用代理类包裹切面,把他们织入到Spring管理的bean中.也就是说代理类伪装成目标类,它会截取对目 ...

  8. 目标跟踪ObjectT综述介绍

    此文也很详细:http://blog.csdn.net/maochongsandai110/article/details/11530045 原文链接:http://blog.csdn.net/pp5 ...

  9. 杭电 2035 人见人爱A^B【快速幂取模】

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=2035 解题思路:这一题数据不大,可以用同余来做,也可以用快速幂来做 反思:定义成 #include&l ...

  10. Flex元素布局规则总结，以及布局和容器

    一.Flex中的元素分类从功能层面可以把Flex中的元素分为组件(Components)和容器(Containers)两大类:组件 - 是指那类具有明确交互或数据展示功能的元素,例如Button.Ch ...