粘贴文字内容时如何实现匹配目标样式，或如何实现格式刷功能

[SturdyCat]

[margox]

格式刷功能有一个实现思路：通过扩展控件添加一个按钮，在选择一段内容后，点击这个按钮调用ContentUtils.getSelectionInlineStyle 拿到所选区域的样式，再选择一段区域，点击另一个按钮调用ContentUtils.toggleSelectionInlineStyle来将前面的样式，应用到新的选区上。

[SturdyCat]

copyStyles: Array(5)
0: "BOLD"
1: "ITALIC"
2: "UNDERLINE"
3: "FONTSIZE-30"
4: "COLOR-C0392B"

ContentUtils.toggleSelectionInlineStyle 遍历样式后只有最后一个样式生效如何处理 希望覆盖样式只触发一次撤销

[margox]

升级一下braft-utils到最新版看看，另外你遍历设置样式的代码是怎么写的？

[margox]

ContentUtils.toggleSelectionInlineStyle这个方法下一版本我做个优化吧，支持直接 传入数组

[SturdyCat]

copyStyles: Array(5)
0: "BOLD"
1: "ITALIC"
2: "UNDERLINE"
3: "FONTSIZE-30"
4: "COLOR-C0392B"
copyStyles.forEach(style => {
        const vals = style.split('-')
        if (style.indexOf('COLOR-') === 0) {
          this.editorInstance.setValue(ContentUtils.toggleSelectionColor(editorState, vals[1]))
        } else if (style.indexOf('FONTSIZE-') === 0) {
          this.editorInstance.setValue(ContentUtils.toggleSelectionFontSize(editorState, vals[1]))
        } 
       ......
      })

遍历后调用setValue修改样式， 下一版什么时候发

[SturdyCat]

格式刷还时很常用的，希望默认控件添加上

[margox]

你这个遍历，每次改变的都是最开始的那个editorState，所以每次后一次遍历体都会覆盖掉前面的，试试下面的写法：

const nextEditorState = copyStyles.reduce((ediorState, style) => {
  const splitedStyle = style.split('-')
  return ContentUtils.toggleSelectionInlineStyle(editorState, splitedStyle[1], splitedStyle[0])
}, editorState)
this.editorInstance.setValue(nextEditorState )

[SturdyCat]

批量覆盖样式后相当于算多次修改样式， 需要多次撤销才可以恢复之前状态，如何能格式刷批量覆盖算一次动作必须要一次撤销动作还原

[joriewong]

const nextEditorState = copyStyles.reduce((editorState, style) => {
  const splitStyle = style.split('-')
  const styleVal = splitStyle[1] || '';
  const prefix = styleVal ? `${splitStyle[0]}-` : splitStyle[0];
  return ContentUtils.toggleSelectionInlineStyle(editorState, styleVal, prefix)
}, initEditorState)