使用react-markdown呈现的markdown中不存在行分隔符

Question

我正在使用react-markdown来呈现一个标记。文本内容呈现正确，但我无法查看标题下和表格的行分隔符。我尝试在演示https://remarkjs.github.io/react-markdown/中粘贴相同的内容，它使用行分隔符正确呈现。

以下是该实现的codesandbox链接。https://codesandbox.io/s/strange-firefly-zzv3r?file=/src/App.js。注意:表的行和列之间没有行分隔符。为了呈现该表，我使用了react-markdown文档中提到的remark-gfm

下面是呈现标记的React组件

import React, { useEffect, useState } from "react";
import ReactMarkdown from "react-markdown";
import remarkGfm from "remark-gfm";

export default function App() {
  const markdown = `# First Heading

  ## SomeHeading()
  Returns some heading if found to be true .
  
  **Syntax:** "SomeHeading(string; search-text; [case-insensitive])"
  |Parameter|Data type|Optional|Text|
  |--|--|--|--|
  |string|string|NO|The text to search in|
  |search-text|string|NO|The string to check|
  |case-insensitive|boolean|YES|set “true” if the search should be case insensitive.|
    `;

  return (
    <div className='post'>
      <ReactMarkdown children={markdown} remarkPlugins={[remarkGfm]} />
    </div>
  );
}

Answer 1

在您的示例中，markdown中的所有行都以2个空格开头。行开头的空格在markdown中不是没有意义的。