meliorence / react-native-render-html

iOS/Android pure javascript react-native component that renders your HTML into 100% native views
https://meliorence.github.io/react-native-render-html/
BSD 2-Clause "Simplified" License
3.48k stars 589 forks source link

Need Help for Break Lines Implementation #647

Open DeepakSharma04 opened 12 months ago

DeepakSharma04 commented 12 months ago
import React from 'react';
import { useWindowDimensions } from 'react-native';
import RenderHtml from 'react-native-render-html';

const source = {
  html: `<p>Okay nice to meet you</p>\n<div data-toggle=\"collapse\" data-target=\".ticket_break_hidden_area\" style=\"cursor: pointer;\">...</div><div class=\"collapse ticket_break_hidden_area\"><div><div><div><div><blockquote>On November 06, 2023 04:41 pm <strong>Indira V</strong> wrote :\n<figure>\n<p>Dear Team,</p>\n<p> </p>\n<p>Our company is growing, and there is a good inflow of projects every week. This has been possible with your dedicated and timely teamwork. In order to keep up with this, we have decided that the working hours would be advanced by 30 minutes.</p>\n<p> </p>\n<p>Feel free to come up with suggestions, if any.</p>\n<p> </p>\n<p>Warm regards,</p>\n<p>Your name</p>\n<p>Designation</p>\n</figure>\n</blockquote></div> `
};

export default function App() {
  const { width } = useWindowDimensions();
  return (
      <RenderHtml
        contentWidth={width}
        source={source}
        enableExperimentalMarginCollapsing={true}
    />
  );
}

Please help ,i want to add break lines implementation means when user click on ... dots it shows the email but it's display all the contents.

Screenshot 2023-11-06 at 4 57 25 PM
DeepakSharma04 commented 11 months ago

@jsamr can you please guide me how to implement it .