请教 V 友前端如何实现类似于豆瓣在富文本编辑器里直接插入 书/影音/投票 之类的功能?

333 天前
 whooami
目前想了下较笨的解决方案。就是当用户选中相应的书时调用手工拼写的 html 代码块插入进去。
但是这种有两个问题[由于是 h5/小程序,所以用了 Uniapp 做的]
1 、这样因为不同端的渲染标签不一样(看起来),在不同端就要准备不同的代码块,有点脏。
2 、书 /影音的还是比较简单的展示块加链接,但是像投票这类的有交互逻辑的通过拼凑代码块插入富文本编辑器应该不太容易实现吧。

非专业前端,没有搜到什么有效的方案(可以搜的关键字也不一定对),想来请教一下各位大佬指点一二。
[![pCmDgtU.png]( https://s1.ax1x.com/2023/06/13/pCmDgtU.png)]( https://imgse.com/i/pCmDgtU)
695 次点击
所在节点    前端开发
6 条回复
ChefIsAwesome
333 天前
富文本编辑器有存 html 和存 json 两种类型。
存 html 的,渲染时不需要 js 。这种编辑器插入内容块的方式自然就是直接插入 html 。传统网页就是服务器生成 html ,js 找到对应的 id 、class 等属性,加上交互功能。这种编辑器生成的内容想要有交互,也是这么处理。
存 json 的,需要 js 渲染。本质上跟那种拖拽建站的东西差不多。段落、图片等等都是一个一个组件。这类编辑器通常也会给你丰富的 api 做自己的组件。
whooami
333 天前
@ChefIsAwesome 哦这样,我用的是封装过的编辑器,只有 html 。我先去研究下,谢谢
freeman12
332 天前
quill.js 是自定义 blot 可以实现
whooami
332 天前
@freeman12 感谢指点。去看了相关的文档。但是现在有点纠结。不过看了下文档,列出的支持的标签列表,那如果这样添加自定义的组件是不是不能渲染? https://uniapp.dcloud.net.cn/component/editor.html
chnwillliu
332 天前
有个点子,用 web component 浏览器原生的自定义组件,html 层面可以做到很干净。但也得想办法整合进编辑器。
whooami
331 天前
@chnwillliu 嗯,你提到了关键的问题点

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/948441

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX