Froala编辑器使用

1.输入授权码:再引用编辑器的页面,

<script>

(function () {

const editorInstance = new FroalaEditor('#Con', {key: "########"}

, {

enter: FroalaEditor.ENTER_P,

placeholderText: null,

imageUploadURL: '@Url.Action("FileUpload","Product")',

imageUploadParams: {

id: 'my_editor'

}

})

})()

</script>

 

2.前台内容与编辑器内样式保持一直

A:在前端显示页面,引用css  

<link rel="stylesheet" href="~/froald_editor/css/froala_style.css">

B:在编辑器展示内容的外边嵌套2个div

     <div class="fr-wrapper" dir="auto"> 

          <div class="fr-element fr-view" dir="auto" contenteditable="true" aria-disabled="false" spellcheck="true">

             @Html.Raw(Model.Product.Con)

          </div>

      </div>

来源：https://www.cnblogs.com/dxh0535/p/11409692.html