Truncate is to shorten by cutting off a part , it has a lot of uses , you might have a post or description you wanna cut short if its longer or more than a certain amount of text.
ill explain how the bellow code works , you could copy and paste code to your project
class Cover extends Component {
state = {
banners: [informations or text we wanna truncate (let say i have 300 words)],
};
}
render() {
//reduce your information or text
const truncate = (input) =>
input?.length > 300 ? `${input.substring(0, 254)}...` : input;
return (
<div>
{truncate(this.state.banners.overview)}
</div>
);
}
}
this code is basically telling the code if your input is greater than 300 it should reduce to 254 and add 3 dots
const truncate = (input) =>
input?.length > 300 ? `${input.substring(0, 254)}...` : input;
we later called the function in our return and added what we wanna truncate or cut
{truncate(this.state.banners.overview)}
Top comments (3)
Hi, it's a nice post. But, i think it can be more easier when you use css instead of js.
Thank you,
falls into preference , some people prefer using it on Js than css .
Hey,
The tag help is used if you have an issue and you need a help to resolve it.