wangeditor/editor-for-react字体怎么设置

WangEditor 是一个轻量级的网页富文本编辑器，支持多种集成方式，包括 React。在 WangEditor 的 React 版本中，字体设置通常可以通过配置项来实现。具体来说，你可以在初始化编辑器时通过 `initialConfig` 或者通过 `editorConfig` 属性来设置字体样式。

以下是一个基本的示例，展示如何在 React 组件中设置字体样式：

import React, { Component } from 'react';
import E from 'wangeditor';

class MyEditor extends Component {
  constructor(props) {
    super(props);
    this.state = { editor: null };
  }

  componentDidMount() {
    const editor = new E(this.editorContainer);
    // 设置字体
    editor.config.onchange = (html) => {
      // 你可以在获取到 html 后，进行一些处理，比如通过正则表达式替换字体样式
    };
    // 配置项中可以设置字体样式
    const config = {
      toolbar: [
        ['bold', 'italic', 'underline', 'strike'], // 加粗、斜体、下划线、删除线
        ['fontFamily', 'fontSize'], // 字体类型和大小
        ['color', 'backColor'], // 文字颜色和背景颜色
        ['superscript', 'subscript'], // 上标、下标
        // 其他配置项...
      ],
      // 其他配置...
    };
    editor.config.customConfig = config;
    editor.create();
    this.setState({ editor });
  }

  componentWillUnmount() {
    this.state.editor.destroy();
  }

  render() {
    return <div ref={el => (this.editorContainer = el)} style={{ height: 400 }} />;
  }
}

export default MyEditor;

在上述代码中，`config.toolbar` 数组中可以包含字体相关的操作，如 `fontFamily` 和 `fontSize`，这会使得用户可以通过编辑器的工具栏来选择字体样式和大小。

此外，如果你想要通过编程的方式动态设置字体，可以使用 `editor.cmd` 方法。例如：

// 设置字体为 Times New Roman
editor.cmd.executeCommand('fontFamily', 'Times New Roman');
// 设置字体大小为14px
editor.cmd.executeCommand('fontSize', 14);

请注意，以上代码仅供参考，实际使用时需要根据 WangEditor 的版本和文档进行相应的调整。