FCC Markdown Previewer 项目在负载测试中失败

Question

我正在尝试通过一个 Freecodecamp 项目。该项目是一个降价预览器，您可以在文本区域中输入代码并将其呈现在网页上。除了两个之外，我已经通过了所有测试。它应该在加载时预览文本并且确实如此，但它会重新呈现，我不确定为什么。有人可以看看并告诉我我做错了什么。我的 CodePen 会有一个 link。我有两个未通过相同测试的解决方案。一个带有 react-hooks，一个带有 class 组件。我正在为 html 解析器使用标记。谢谢！

我几乎确信它在组件中与文本区域有关，因为这是失败的测试之一，但我可以找到它的任何问题。

这是文本编辑器组件：

const Editor = ({ text, setText }) => {
  return (
    <>
      <textarea id='editor' value={ text } onChange={ (e) => setText(e.target.value) } />
    </>
  );
};

这是状态，占位符是 html 的字符串：

const [ text, setText ] = React.useState(placeholder);

CodePenLink

Answer 1

您的 placeholder 里面有 html，而不是 markdown。您可以尝试使用类似这样的东西作为您的 placeholder，它应该可以工作


const placeholder = `
# Sample Markdown Header Level

## Sample Header Level 2

### Link

Here's a link to [Codepen](https://codepen.io).

### Code Block

1.  Open the file.
2.  Find the following code block on line 21:

        <html>
          <head>
            <title>Test</title>
          </head>

3.  Update the title to match the name of your website.

### Inline Code

I think you should use an \`<addr>\` element here instead.

### List

- First item
- Second item

### Blockquote

> Dorothy followed her through many of the beautiful rooms in her castle.

### Image

![Markdown Logo](https://upload.wikimedia.org/wikipedia/commons/thumb/4/48/Markdown-mark.svg/208px-Markdown-mark.svg.png "Markdown Logo")

### Bold Text

I just love **bold text**.
`;

FCC Markdown Previewer 项目在负载测试中失败

FCC Markdown Previewer project failing on load test

javascript

reactjs

javascript-marked

react-redux

react-hooks