在Vue项目中使用kindEditor编译器
kingEditor官网地址:http://kindeditor.net/demo.php里面有大量的demo,可根据需求自行选择。我在项目中选用kindEditor是因为它的体积比较小(2M多)。(Ueditor编译器7M多)在项目中写入:html<textarea id="content2" name="content" style="width:700px;height:350p
·
kingEditor官网地址:http://kindeditor.net/demo.php
里面有大量的demo,可根据需求自行选择。
我在项目中选用kindEditor是因为它的体积比较小(2M多)。(Ueditor编译器7M多)
在项目中写入:
html
<textarea id="content2" name="content" style="width:700px;height:350px;visibility:hidden;" onkeyup="this.value=this.value.replace(/^\s+|\s+$/g,'')">
</textarea>;
js:
function htmlencode(s){
var div = document.createElement('div');
div.appendChild(document.createTextNode(s));
return div.innerHTML;
}
KindEditor.ready(function(K) {
editor = K.create('#content2', {
themeType : 'simple',
afterBlur:function(){
this.sync();
}
});
//提交按钮
K('button[name=getHtml]').click(function(e) {
html_t = editor.html();
html_k = htmlencode(html_t);
});
//清空按钮
K('button[name=clear]').click(function(e) {
editor.html('');
vm_write.cancelSend();
window.history.go(-1);
});
});
//在提交编辑器里的内容的时候,需要将html_k转码一下,
html_k = encodeURIComponent(html_k);
axios({
method:'post',
url:'/f/api/socialWorkerBridge/add',
data:{
type:vm.type,
title:vm.title,
content:html_k,
name:vm.name,
phone:vm.telphone,
email:vm.email
}
}).then(function(res){
console.log(res.data);
}).catch(function (res) {
console.log(res.data);
});
在拿到上边所传的html_t的时候,同样需要转码才可以变成我们之前所输入的文字。
vm.content = decodeURIComponent(response.data.content);
以上为个人使用方式,如有错误,望指点。
更多推荐
已为社区贡献4条内容
所有评论(0)