Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/386.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 使用clamp.js在React中使用Line clamp导致IE11中的对象错误_Javascript_Internet Explorer_Reactjs_Cross Browser_Clamp - Fatal编程技术网

Javascript 使用clamp.js在React中使用Line clamp导致IE11中的对象错误

Javascript 使用clamp.js在React中使用Line clamp导致IE11中的对象错误,javascript,internet-explorer,reactjs,cross-browser,clamp,Javascript,Internet Explorer,Reactjs,Cross Browser,Clamp,目标:当任务描述超过其容器的两行时,让浏览器以响应方式呈现溢出文本省略号,而不是在任务描述不超过两行时 下面是我的React组件,我们正在导入的夹具是 我已经看过这个帖子https://github.com/josephschmitt/Clamp.js/issues/24并尝试了他们的建议,明确指定钳制参数并将CSS设置为: .desc-text display: block; line-height: 18px; margin-top: -20px; 我们还尝试修改clamp.

目标:当任务描述超过其容器的两行时,让浏览器以响应方式呈现溢出文本省略号,而不是在任务描述不超过两行时

下面是我的React组件,我们正在导入的
夹具是

我已经看过这个帖子
https://github.com/josephschmitt/Clamp.js/issues/24
并尝试了他们的建议,明确指定钳制参数并将CSS设置为:

.desc-text
  display: block;
  line-height: 18px;
  margin-top: -20px;
我们还尝试修改clamp.js(链接在上面)中的第117行,以包含
elem.lastChild
,现在是:

if (elem.lastChild && elem.lastChild.children && elem.lastChild.children.length > 0) { ...
因此,如果出现以下情况,则在进入下一步时会出现一个稍有不同的错误:

[object Error] {description: "Unable to get property 'parentNode' of undefined or null reference", name: "TypeError", number: "-2146823281"}

有人知道如何让线夹在IE中工作吗

在React应用程序中,使用这样与DOM交互的库可能会有问题。我更幸运地坚持使用特定于react的库或构建自己的组件

我最近不得不实现一个跨浏览器的线夹(IE10+)并且对我在那里发现的任何东西都不满意,所以我推出了自己的。我从clamp.js逻辑开始,并从那里调整它以提高性能和准确性。基本方法是修剪字符串,直到元素达到所需的高度,然后您就可以准确地知道可以容纳多少个字符,并且可以根据需要从那里修剪以显示省略号或修剪到最后一个单词。使其快速平滑渲染需要一些技巧和时间。如果您想更具体地了解我的实现,或者尝试一下我的npm包,请查看此处:

if (elem.lastChild && elem.lastChild.children && elem.lastChild.children.length > 0) { ...
[object Error] {description: "Unable to get property 'parentNode' of undefined or null reference", name: "TypeError", number: "-2146823281"}