javascript - 如何调整react-draft-wysiwyg body中的内容样式

标签 javascript html reactjs react-draft-wysiwyg

我是 React 新手,我已经使用过 draftjs 编辑器,但是当我尝试使用代码时,边框没有显示。

这是编辑器的快照:

border of the body

我的代码:

export default class App extends Component {
  render() {
    return (
      <Container>
        <Modal trigger={<Button>Show Content</Button>}>
          <Modal.Content>
            <Editor />
            <Button>Send</Button>
          </Modal.Content>
        </Modal>
      </Container>
    );
  }
}

这里是完整的代码: "https://codesandbox.io/s/distracted-ritchie-s75re "

尝试给出边界,但问题是当我写更多的字时,它会超出边界。谁能帮我解决这个问题?

最佳答案

首先,您使用的是 react-draft-wysiwyg


可以通过editorStyle的属性设置编辑器样式

editorStyle: style object applied around the editor

import { Editor } from "react-draft-wysiwyg";
import "react-draft-wysiwyg/dist/react-draft-wysiwyg.css";
...
<Editor editorStyle={{ border: "1px solid" }} />

enter image description here

关于javascript - 如何调整react-draft-wysiwyg body中的内容样式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60882835/

相关文章:

html - 如何在 Rails 中启用自动代码重新加载

javascript - Webpack 和 Babel 意外导入 token

javascript - 如何在同一浏览器窗口内的不同表单中访问一个表单中的变量?

javascript - 停止 onClick 函数的发生

javascript - 使用 JavaScript 读取缓存

javascript - 为什么我的 JQuery 推送菜单突然不工作了?

高度为 100% 的 HTML 布局

php - 如何在 $_SESSION 中存储和检索错误数组

android - 错误 : null is not an object (evaluating 'C.State' ) <unknown> index. android.bundle

reactjs - React 和 Socket.io | useState 在输入中 onChange 生成新的套接字连接