block-content-to-react
block-content-to-react copied to clipboard
Apply truncate function on content
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 !