Как установить многоточие при переполнении текста с помощью dangerousSetInnerHTML React?

Question

Я пытаюсь сохранить содержимое как HTML-тег и распечатать его. Я установил его на «переполнение текста: многоточие», потому что мне нужны только краткие сведения, но это не работает. Есть ли обходной путь?

        const MyFeedList: IPost = MainData?.recentMyPostResponseList?.map((item: any) => {
    return (
      <div className="feed" key={item.id}>
        <img src={item.postImage} width="500px" />
        <h4>{item.postName}</h4>
        <h6
          style={{ overflow: "hidden", textOverflow: "ellipsis" }}
          dangerouslySetInnerHTML={{
            __html: DOMPurify.sanitize(item.content),
          }}
        ></h6>
      </div>
    );
  });

Answer 1

Попробуй это:-

      h6{           
            width:50%;
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 1;
            -webkit-box-orient: vertical;
}