Uso el material del editor HTML ui:
import MUIEditor, { MUIEditorState } from "react-mui-draft-wysiwyg"; <MUIEditor editorState={formElement.editorState} onChange={formElement.onChange} />Quiero eliminar el botón de color de fuente en la barra de herramientas. Cuando voy al archivo MUIEditor en node-modules y quiero hacer algunos cambios en ese archivo, pero parece que no cambia incluso cuando obtengo una consola, no puedo ver el resultado. ¿Qué tengo que hacer?
.node_modules .react-mui-draft-wysiwyg .dist .index.jsRara vez es aconsejable editar el contenido de /node_modules ; en su lugar, react-mui-draft-wysiwyg proporciona una forma directa de personalizar la configuración de la barra de herramientas a través del accesorio de config , en su propio código React.
En su caso, para ocultar el botón de color de fuente, simplemente necesita pasar las opciones de menú que le gustaría mostrar. (es decir, eliminar/comentar la opción toolbarControlTypes.fontColor ). Por ejemplo:
import MUIEditor, { MUIEditorState, toolbarControlTypes // Added toolbarControlTypes } from "react-mui-draft-wysiwyg"; ... <MUIEditor editorState={editorState} onChange={onChange} config={{ toolbar: { controls: [ toolbarControlTypes.undo, toolbarControlTypes.redo, toolbarControlTypes.divider, toolbarControlTypes.bold, toolbarControlTypes.italic, toolbarControlTypes.underline, toolbarControlTypes.strikethrough, // Include all of the default toolbar options except for fontColor // toolbarControlTypes.fontColor, toolbarControlTypes.fontBackgroundColor, toolbarControlTypes.divider, toolbarControlTypes.linkAdd, toolbarControlTypes.linkRemove, toolbarControlTypes.image, toolbarControlTypes.divider, toolbarControlTypes.blockType, toolbarControlTypes.fontSize, toolbarControlTypes.fontFamily, toolbarControlTypes.textAlign, toolbarControlTypes.divider, toolbarControlTypes.unorderedList, toolbarControlTypes.orderedList ] } }} />Documentación: Opciones de configuración predeterminadas
Código de trabajo Sandbox:https://codesandbox.io/s/mui4-draft-wysiwyg-bre8e?file=/demo.js