1

目前我正在使用 React 并在我的 Strapi CMS 中的富文本中包含内容,这些内容在我的降价版本中以我想要的方式隔开,但是一旦我切换到预览,或者在我的浏览器中查看内容,空间就会消失离开。我尝试添加<br/>标签,但仍然没有换行符。

这是我的strapi markdown中的内容: ![图片|690x273, 50%](上传://jy7Rsdurp6rq6VNB0ki4Jnc9L24.png)

但这是我网页上的输出: ![图片|690x128, 50%](上传://b4cGhjj4uOjO6uCCpXcggetnqNO.png)

这是我当前的代码:

import ReactMarkdown from "react-markdown";
import rehypeRaw from "rehype-raw";
export default function name({ posts }) {
  return (
    <>
        <div>
          {posts.Title}
        </div>
      <div>
        <ReactMarkdown children={posts.Content} rehypePlugins={[rehypeRaw]} />
      </div>
    </>
  );
}
4

1 回答 1

1

要添加多个换行符,应该这样做:

import React from "react";
import "./styles.css";

import ReactMarkdown from "react-markdown";

export default function App() {
  const markdown = `hello
  \n &nbsp;
  \n &nbsp;
  \n &nbsp;
  \n &nbsp;
  \n
  world
  `;

  return (
    <div className="App">
      <ReactMarkdown source={markdown} />
    </div>
  );
}

编辑 react-markdown 基本示例(分叉)

于 2021-09-02T08:32:11.313 回答