Question

我正在尝试复制将儿童呈现为原始HTML markdown的部分，但是我觉得有一种简单的方法可以在我的鼻子底下进行此操作，或者我以错误的方式进行此设计-或两者

这是对带有注释框的ReactJS.NET教程的更改模仿-而不是呈现服务器端注释，但是，我在票证类中传递了Google Calendar事件。我曾尝试在以下类似的帖子中遵循该建议，但似乎无法让孩子们代替文字的markdown字符来填充这些人：

Rendering raw html with reactjs

带有原始减价的机票组件：

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>
        );
    }
}

在上面的代码中，很确定我只是缺少一些细节，我有一个“聪明”的想法，即在危险地设置InnerHTML范围内的文字字符串中调用这两个属性，但是当然，它只是写出文字字符属性本身，这是我应该期望的。有人可以给我最好的方式将props.children.description和props.children.currentApptTime呈现为表格单元格吗？

我一直在检查一些教程资源，这些资源讨论将React组件呈现为表数据，因此，如果您觉得我应该完全将我的方法更改为其中一种方法，请告诉我您认为哪种方法最好！ / p>

在表单元格中显着显示React Markdown？

0 个答案: