将样式添加到npm ShowMore组件以进行预览支付

Question

我正在尝试证明ShowMore组件中的文本合理。但是我当前的代码仅在文本完全不付清的情况下才是合理的，而不是在“ showLess”情况下。

<p style={{ marginTop: '0.7em', textAlign: 'justify' }}>
    <ShowMore
        lines={4}
        more="plus"
        less="moins"
        anchorClass=""
    >
       {this.content}
    </ShowMore>
</p>

如何也将样式应用于无展示模式？

这是完整的课程：

class News extends Component {
    constructor(props) {
    super(props);
    this.event = { title: 'some title for this event' };
    this.content = 'Nec minus feminae quoque calamitatum participes fuere similium. nam ex hoc quoque sexu peremptae sunt originis altae conplures, adulteriorum flagitiis obnoxiae vel stuprorum. inter quas notiores fuere Claritas et Flaviana, quarum altera cum duceretur ad mortem, indumento, quo vestita erat, abrepto.';
}

render() {
    return (
        <Segment>
            <p>{this.event.title}</p>
            <p style={{ marginTop: '0.7em', textAlign: 'justify' }}>
                <ShowMore
                    lines={3}
                    more="plus"
                    less="moins"
                    anchorClass=""
                >
                    {this.content}
                </ShowMore>
            </p>
        </Segment>
    );
  }
}

谢谢您的帮助

伊萨亚