//1. 從第三個開始刪除,刪除4個
4)); // 12345678 1278
//2.(返回物件)返回從第三個開始,返回4個,編輯器裡面不變 .insert = 3456; 不寫引數引數,預設全部
4)); // 12345678 3456
//3.檢索編輯器內容的長度 返回值是要加一
// 12345678 9
//4.同quill.getcontents(2, 4);返回值不一樣,
4)); // 12345678 3456
//5.編輯器裡值不會被覆蓋 編輯器裡插入值 (位置,型別,內容)
'image', ''));
//6.編輯器裡值不會被覆蓋 編輯器裡插入值(文字) (位置,內容, 格式)
'hello', 'bold', true));
'quill', ));
//7.編輯器裡值被覆蓋 編輯器裡插入值(文字) (位置,內容, 格式) 以結尾
// },
////
]));
//8.編輯器裡值被覆蓋
'hello\n'));
//9.沒研究,會報錯 home.vue?250d:109 uncaught referenceerror: delta is not defined
delta()
//.retain(6) // keep 'hello '
//.delete(5) // 'world' is deleted
//.insert('quill')
////
));
//10.設定編輯器裡內容格式format
'color', 'red');
'align', 'right');
'hello\nworld!\n');
//formatline(index: number, length: number, source: string = 'api'): delta
//formatline(index: number, length: number, format: string, value: any,
//source: string = 'api'): delta
//formatline(index: number, length: number, formats: ,
//source: string = 'api'): delta
2, 'align', 'right'); // right aligns the first line
4, 'align', 'center'); // center aligns both lines
'hello\nworld!\n');
5, 'bold', true); // bolds 'hello'
5, );
1, 'align', 'right'); // right aligns the 'hello' line
//13 getformat 獲取格式
'hello world!');
2, 'bold', true);
2, 'italic', true);
2); //
1); //
//14. 移除格式 removeformat
// },
// },
// },
// },
//},
// }
//]);
7);
獲取區域
//getbounds(index: number, length: number = 0):
//返回值
'hello\nworld\n');
2)); // returns
//16.獲取滑鼠的位置 getselection
//var range = this.quill.getselection();
//if (range) else
//} else
//17
this.quill.on('text-change', function
(delta, olddelta, source)
else
if (source == 'user')
});
vue中封裝富文字編輯器Quill
quill,樣式不用多說,也是主流的黑白清新風,美觀,功能上雖然不是很多,甚至還沒有 網路上傳 可以通過複製網路並黏貼解決 等功能,但它的 高亮是最完美的,同樣支援行內編輯模式,可自定義,總的來說,這是一款優點多但缺點同樣明顯的編輯器,以前用過ueditor,區別大概就是ueditor需要在conf...
Quill 富文字編輯器二次封裝
quill 是乙個很流行的富文字編輯器,github 上 star 大約 21k。但是很少專案中使用時直接使用它,都要對其進行二次封裝,你作為乙個頁面仔是擋不住有想法的產品經理的。href rel stylesheet src script npm install quill import quil...
富文字編輯器
關於使用富文字編輯器的一些小坑 官網 1.專案 片 editor fail function xhr,editor,result custominsert function insertimg,result,editor this.editor.create this.editor.txt.html...