jackyr / react-multi-clamp

Simple, efficient and easy-to-use multiline text clamp react component. (supports reverse clamp)

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

为什么当ellipsis是react dom的时候onclick事件触发不了?

ldwonday opened this issue · comments

const handleLookMore = (e: MouseEvent) => {
    e.preventDefault()
    setIsLookMore(true)
  }
<MultiClamp
          clamp={isLookMore ? false : (MomentType.IMAGE_TEXT && images && images.length > 0) ? 1 : 3}
          ellipsis={<span>... <a href='javascript: void(0)' onClick={(e: MouseEvent) => handleLookMore(e)}>查看更多</a></span>}
        >
          {content}
        </MultiClamp>

上面 onclick事件触发不了!

@ldwonday 谢谢反馈,这是一个功能遗漏点,目前的实现是取了ellipis的innerHTML,因此react的绑定事件会失效。解决这个问题比较麻烦,可能涉及到底层改动,我需要一些时间处理。可以先临时hack一下:

componentDidMount() {
  setTimeout(() => {
    document.querySelector('a').addEventListener('click', () => {
      alert(123);
    });
  }, 100);
}

@ldwonday 久等了,该问题已在v2.0.1版本解决,Demo

谢谢,very good!~!