Descargar slatejsx - Descargar el código fuente de slatejsx

slatejsx

Otros recursos

1.0.0

Descargar

Introducción

Todo el editor de texto enriquecido se desarrolla en base a Slatejs y admite completamente funciones comunes como texto rico, imágenes, tablas (admite células de fusión y división), videos, líneas horizontales, etc.
Admite componentes de extensión personalizados, consulte la documentación oficial de SlateJS para más detalles
Fuera de la caja, fácil de operar. JSON almacena texto rico. Bienvenido a usar, me gusta y enviar ramas

instalar

npm install slatejsx

Ejemplo en línea de demostración

http://seditor.open.heyphp.com

uso

 import SEditor from 'slatejsx' ;
import 'slatejsx/dist/index.css' ;
import { useState } from 'react' ;

const config = [
  {
   "type" : "paragraph" ,
   "title" : "h1" ,
   "children" : [
    {
     "text" : ""
    }
   ]
  }
]

const [ value , setValue ] = useState ( config )

// 上传图片的回调，示例中将图片转为base64写入json，如果需要存到云存储可以改写此方法
const onUploadImage = ( file , callback ) => {
  const reader = new FileReader ( ) ;
  reader . addEventListener ( 'load' , ( ) => {
      const url = reader . result ;
      callback ( url )
  } ) ;

  reader . readAsDataURL ( file ) ;
}

function App ( ) {
  return (
    < SEditor
      value = { value }
      plugins = { [ ] }
      readOnly = { false }
      param = { { onUploadImage } }
      onChange = { v => setValue ( v ) }
    />
  ) ;
}

export default App ;

Descripción del parámetro de accesorios

parámetro	tipo	ilustrar
valor	formación	Consulte la documentación oficial de SlateJS, puede inicializar la estructura en el ejemplo.
en el cambio	función	Devoluciones de llamada Cuando cambia los datos, consulte el ejemplo anterior
complementos	formación	Complemento adicional, si necesita agregar nuevas funciones del editor, puede pasarlo a través de este parámetro.
readonamente	booleano	De solo solo lectura, si es cierto, no hay una barra de herramientas y no se puede editar
parámetro	{}	Parámetros adicionales, los parámetros se escribirán en la entidad de usoslate ()