Визуализировать уценку реагирования в ячейках таблицы? - PullRequest
Новая
       28

Визуализировать уценку реагирования в ячейках таблицы?

0 голосов
/ 01 февраля 2019

Я пытаюсь воспроизвести ту часть, где дети отображаются в виде исходной HTML-разметки, но я чувствую, что есть или простой способ сделать это прямо у меня под носом, или я подхожу к этой схеме неправильно - или оба.

Это измененная имитация учебника ReactJS.NET с полями комментариев - вместо того, чтобы отображать комментарии на стороне сервера, я передаю события Календаря Google в классе заявок.Я попытался следовать предложению в некотором похожем посте ниже, но я не могу заставить детей заполнять вместо буквальных символов уценки:

Рендеринг необработанного html с реагированием

Компонент тикета с необработанной уценкой: 

class Ticket extends React.Component {
    rawMarkup() {
        var md = createRemarkable();
        var rawMarkup = md.render(this.props.children.toString());
        return { __html: rawMarkup };
    }
    render() {
        return (
            <tr>
            <div className="ticket">
                <h2 className="ticketSummary">
                    {this.props.summary}
                    </h2>
                    <tr border>
                        <span dangerouslySetInnerHTML={{ __html: 'props.children.description &middot; props.children.currentApptTime' }} />
                        </tr>
                </div>
                </tr>
        );
    }
}

Родительский компонент, в который передается тикет: 

class TicketList extends React.Component {
    render() {
        const ticketNodes = this.props.data.map(ticket => (
            <Ticket summary={ticket.summary} key={ticket.id}>
                {ticket.description}{ticket.currentApptTime}
            </Ticket>
        ));
        const ticketRaw = this.props.data.map(ticket => (
            <tr>
                    <td>{ticket.summary}</td><td>{ticket.id}</td><td>{ticket.description}</td><td>{ticket.currentApptTime}</td>
                </tr>
        ));
        return (
            <div className="ticketList">

                    {ticketNodes}

            </div>
        );
    }
}

В приведенном выше коде я почти уверен, что мне просто не хватаетнекоторые детали, у меня была «яркая» идея вызова обоих свойств в литеральной строке внутри опасного диапазона SpinInnerHTML, но, конечно, это просто записывает литеральные символы вместо самих свойств, что я и ожидал.Может кто-нибудь дать мне лучший способ визуализации props.children.description и props.children.currentApptTime в качестве ячеек таблицы?

Я проверял несколько учебных материалов, в которых рассказывается о рендеринге компонентов React как данных таблицы,поэтому, если вы считаете, что я должен полностью изменить свой подход к одному из этих подходов, дайте мне знать, какой из них вы считаете лучшим!

...