editablejs / editable

🌱 A collaborative rich-text editor framework that focuses on stability, controllability, extensibility, and performance. 一款强到离谱的富文本编辑器框架,专注于稳定性、可控性、扩展性和性能。
https://docs.editablejs.com
Apache License 2.0
1.79k stars 120 forks source link

使用yjs开启协同之后,如何将自定义的数据渲染到编辑器中,开启协同的时候好像编辑器重置了,该如何自定义内容 #166

Open Jedi1820 opened 7 months ago

big-camel commented 7 months ago
  1. 可以从服务端初始化内容
  2. 连接后,可以使用api清楚掉编辑内的所有内容,然后再插入你要的内容,这样就修改了服务端,其它客户端也会同步到对应的内容
Jedi1820 commented 7 months ago

你指的是server端的startServer这个方法吗,这个方法需要提前内置内容才可以吧,我想实现的在编辑器开启协同之后,通过外部接口或者其他地方获取的数据渲染到编辑器中,如果使用服务端的方法,该如何动态传递给他 @big-camel

Jedi1820 commented 7 months ago

api清除掉编辑内的所有内容,然后再插入内容,这个该如何操作 @big-camel

big-camel commented 7 months ago
import startServer from '@editablejs/yjs-websocket/server'

startServer({
  initialValue: {
    children: [
      // 启用标题插件下的默认值
      {
        type: 'title',
        children: [{ text: '' }],
      },
      {
        type: 'paragraph',
        children: [{ text: '' }],
      },
    ],
  },
})

你可以看下api或者源代码

Jedi1820 commented 7 months ago

这一段看到了,这一段是在服务端的😂,没找到在编辑器段可以直接修改的api

big-camel commented 7 months ago

先设置 selection 为全选,可以调用删除相关的api(deleteForward deleteBackward) 或者 insertFragment 插入新的

Jedi1820 commented 7 months ago

如何主动获取到协同编辑的所有协作者的信息,有api可以使用吗

big-camel commented 7 months ago

const remoteClients = useRemoteStates<CursorData>(editor)