block-content-to-react icon indicating copy to clipboard operation
block-content-to-react copied to clipboard

Apply truncate function on content

Open ErnestBrandi opened this issue 2 years ago • 0 comments

Hi, I have very simple data text (a description) and want to apply lodash truncate function on it. But on some descriptions I have line-breaks which make my content a little more complex from a sanity point of view. If I use a "block serializer"

<BlockContent
  blocks={work.descriptionRaw}
  serializers={{
    types: {
      block: (props) => {
        console.log(props.children);
        return <p>{props.children}</p>;
      },
    },
  }}
/>;

I can see some of the texts contain the following object which seems to represent a line break { "$$typeof": Symbol("react.element"), type: HardBreakSerializer(), key: "hb-1", … }

Therefore if I apply truncate function on it, it displays [object Object] for those objects being misinterpreted. What can I do to go around this problem ? Thanks !

ErnestBrandi avatar Sep 29 '21 14:09 ErnestBrandi