react函数组件中InputTextArea如何格式化高亮显示json不使用react-json-view

您可以使用<pre>标签和CSS样式来格式化和高亮显示JSON。以下是一个示例：

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

function MyComponent() {
  const jsonString = '{ "name": "John", "age": 30, "city": "New York" }';

  return (
    <div>
      <pre className="json">{jsonString}</pre>
    </div>
  );
}

并且在 styles.css 文件中定义以下样式：

.json {
  background-color: #eee;
  padding: 10px;
  border-radius: 5px;
  overflow: auto;
}

.json::before {
  content: '{';
  color: #999;
  font-weight: bold;
}

.json::after {
  content: '}';
  color: #999;
  font-weight: bold;
}

.json-key {
  color: #c00;
}

.json-string {
  color: #080;
}

.json-number {
  color: #00c;
}

这将以灰色背景、圆角边框和滚动条的形式显示 JSON，同时使用 CSS 样式对 JSON 中的关键字、字符串和数字进行着色。