用零代碼的思維設(shè)計(jì)文檔編輯引擎
嗨,大家好,我是徐小夕。之前和大家分享了很多零代碼,可視化相關(guān)的最佳實(shí)踐,最近也花了很多實(shí)踐研究文檔引擎,接下來就和大家分享一下最近的研究成果。
大家上圖看到的就是我做的文檔編輯引擎,類似于飛書文檔和釘釘文檔,我們可以使用它輕松編寫文檔,并能隨意調(diào)整文檔元素的順序。
這一方案實(shí)現(xiàn)依賴于block 的設(shè)計(jì)思想,我們可以把文檔想象成一個個由塊組成的內(nèi)容,每一個塊都能共享編輯器對應(yīng)的能力,并且可以分治管理。
體驗(yàn)地址:http://wep.turntip.cn/design/doc?id=d1711853506463&uid=wep_251711700015023。
功能介紹
由于我之前研究了并開發(fā)了很多零代碼產(chǎn)品,所以基于零代碼的設(shè)計(jì)思想,將文檔編寫進(jìn)行了進(jìn)一步的升級,支持如下功能:
- 支持插入互動組件(如點(diǎn)贊,關(guān)注,贊賞,彈幕等)
- 支持嵌入豐富組件物料(圖表,思維導(dǎo)圖,網(wǎng)頁,視頻等)
- 支持自定義文檔元素 / 組件
- 支持文檔大綱自動生成
接下來我演示一下部分功能:
插入表格
插入圖表
編輯圖表數(shù)據(jù):
插入網(wǎng)頁
我們銅過輸入鏈接可以自動生成網(wǎng)頁的信息, 這塊采用類似爬蟲的技術(shù)來實(shí)現(xiàn)對網(wǎng)址的解析。
插入視頻
我們可以輸入視頻網(wǎng)址來一鍵渲染視頻:
插入第三方網(wǎng)頁
我們可以在自己的文檔里內(nèi)嵌一個第三方網(wǎng)址,并能提供相關(guān)的服務(wù)。
插入數(shù)學(xué)公式
我們可以通過可視化的方式來編寫高級數(shù)學(xué)公式,比如微積分,三角函數(shù),矩陣變換等,而無需懂 Latex 語法。