ueditor blazor

Ueditor-Blazor

基于Ueditor和Blazor的Wysiwyg丰富的文本Web编辑器。

？当前版本

• 发布：
• 发展：

用法

1. 安装软件包

     $ dotnet add package UEditorBlazor -v 0.1.0- *

2. 导入JS资源

       < script >
           window . NEDITOR_UPLOAD = "/api/upload" ;
       </ script >
       < script src =" _content/UEditorBlazor/neditor.config.js " > </ script >
       < script src =" _content/UEditorBlazor/neditor.all.min.js " defer > </ script >
       < script src =" _content/UEditorBlazor/neditor.service.js " > </ script >
       < script src =" _content/UEditorBlazor/ueditor-blazor.js " > </ script >

3. 就这样！然后，您可以使用UEditor.Editor组件。

   < UEditor .Editor @ref = " editor " @bind-Value = " value " @bind-Html = " html " Height = " 500px " Width = " 700px " />
   
   @code {
       string value = " Hello Blazor! " ;
       string html ;
   
       Editor editor ;
   }

图像加载

如果要实现自定义图像加载，请按照以下列出的说明：

1。设置上传API端点：

 < script >
    window . NEDITOR_UPLOAD = "/api/upload" ;
</ script >

在neditor.service.js中，请确保在getActionUrl函数中，返回window.NEDITOR_UPLOAD 。

2。图像上传服务器实现：

2.1在添加API控制器之前，注册一些东西

 services . AddControllers ( ) ; 

2.2为存储图像添加目录

 app . UseStaticFiles ( new StaticFileOptions {
    FileProvider = new PhysicalFileProvider ( image_path ) ,
    RequestPath = "/I"
} )

/I后缀用于显示预览图像。您可以在控制器中修改image_path和/I 。

2.3编写一个API控制器以处理/api/upload请求

请参阅ImageController.cs 。请记住root和result.url变体应与2.2中提到的变体相同。

3。享受。