Codemirror показывает все данные в формате JSON в одну строку - PullRequest
Новая
       43

Codemirror показывает все данные в формате JSON в одну строку

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

Запущен новый проект с использованием response-codemirror2 и response-jsonschema-form, также очень похожего https://mozilla -services.github.io / реагировать-jsonschema-form /

Однако, когдамой редактор codemirror отображает JSON, в который я загружаю все шоу в одну строку.Я прошел через исходный код https://mozilla -services.github.io / реагировать-jsonschema-form / и не могу найти ничего отличного от того, что у меня есть.

enter image description here

Мой исходный код: 

    import React, { useEffect, useState } from "react";
import { UnControlled as CodeMirror } from "react-codemirror2";

import "codemirror/lib/codemirror.css";
import "codemirror/theme/material.css";
import "codemirror/mode/javascript/javascript.js";

// components

const CodeEditorContainer = ({ code, onChange }) => {
  const [codeEditorState, setCodeEditorState] = useState();

  useEffect(() => {
    setCodeEditorState(code);
  }, [code]);

  const cmOptions = {
    theme: "default",
    height: "auto",
    viewportMargin: Infinity,
    mode: {
      name: "javascript",
      json: true,
      statementIndent: 2
    },
    lineNumbers: true,
    lineWrapping: true,
    indentWithTabs: false,
    tabSize: 2
  };

  return (
    <div className="panel panel-default">
      <div className="panel-heading">Schema Editor</div>
      <CodeMirror
        value={codeEditorState}
        options={cmOptions}
        autoCursor={false}
        onChange={(editor, data, value) => onChange(value)}
      />
    </div>
  );
};

export default CodeEditorContainer;

Редактировать: проблема заключалась в том, как я анализировал JSON в строку вместо

JSON.stringify(json)

Я использовал

JSON.stringify(json, null, 2)

1 Ответ

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

Проблема заключалась в том, как я анализировал JSON в строку вместо

JSON.stringify(json)

Я использовал

JSON.stringify(json, null, 2)

...