Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

你好作者大大,我这边回显上有点问题想问一下 #286

Closed
zyj2077 opened this issue Oct 24, 2024 · 13 comments · Fixed by #295
Closed

你好作者大大,我这边回显上有点问题想问一下 #286

zyj2077 opened this issue Oct 24, 2024 · 13 comments · Fixed by #295

Comments

@zyj2077
Copy link

zyj2077 commented Oct 24, 2024

问题描述

<img src="{_XD}/标特/image/1729750472900-g93p4zfcrsn.png" alt="1729750472900-g93p4zfcrsn.png" data-href="" style="width: 532.00px;height: 354.66px;float: right;"/>

当前富文本的元素,使用的插件的浮动效果

但是,在设置编辑器回显的时候,浮动效果会自动清除,这个怎么处理好一些

@cycleccc
Copy link
Owner

浮动效果清除是指 float 属性丢失吧,属性处理一般是在 parseElemsHtml 里处理,你可以 debug看看对应的 image elem 里有没有 float 属性。

@zyj2077
Copy link
Author

zyj2077 commented Oct 24, 2024

在导出的时候是有相应样式的,就是讲导出的html格式再次导入的时候,就没有了。editor.dangerouslyInsertHtml(html) 和setHtml两个都是过,一样 parseElemsHtml 这个在哪呀

在导出的时候是有相应样式的,就是讲导出的html格式再次导入的时候,就没有了。editor.dangerouslyInsertHtml(html) 和setHtml两个都是过,一样 parseElemsHtml 这个在哪呀

@cycleccc
Copy link
Owner

cycleccc commented Oct 24, 2024

导出没问题那就是解析的问题,parseElemsHtml 是自定义的插件里用来处理编辑区样式的模块,类似这里
https://github.com/hqwlkj/wangEditor-plugin-float-image/blob/6476947de2b20e39848cb8f607ebd1189d782c77/src/module/parse-elem-html.ts#L11

@cycleccc
Copy link
Owner

得要 debug 看一下具体哪里没解析到

@zyj2077
Copy link
Author

zyj2077 commented Oct 24, 2024

问个萌新问题,这个怎么进行debug,在f12 上吗?还是在代码编辑器上?

@zyj2077
Copy link
Author

zyj2077 commented Oct 24, 2024

导出没问题那就是解析的问题,parseElemsHtml 是自定义的插件里用来处理编辑区样式的模块,类似这里 https://github.com/hqwlkj/wangEditor-plugin-float-image/blob/6476947de2b20e39848cb8f607ebd1189d782c77/src/module/parse-elem-html.ts#L11

这个没看懂他具体可以怎么用,这边也是用的这个插件,但是这个方法貌似是在编辑区域,进行格式转换的一个方法

@cycleccc
Copy link
Owner

问个萌新问题,这个怎么进行debug,在f12 上吗?还是在代码编辑器上?

在浏览器里找到对应的插件代码打断点

@cycleccc
Copy link
Owner

导出没问题那就是解析的问题,parseElemsHtml 是自定义的插件里用来处理编辑区样式的模块,类似这里 https://github.com/hqwlkj/wangEditor-plugin-float-image/blob/6476947de2b20e39848cb8f607ebd1189d782c77/src/module/parse-elem-html.ts#L11

这个没看懂他具体可以怎么用,这边也是用的这个插件,但是这个方法貌似是在编辑区域,进行格式转换的一个方法

是的,解析对应 dom 元素获取属性,返回 children content 格式

@zyj2077
Copy link
Author

zyj2077 commented Oct 24, 2024

导出没问题那就是解析的问题,parseElemsHtml 是自定义的插件里用来处理编辑区样式的模块,类似这里 https://github.com/hqwlkj/wangEditor-plugin-float-image/blob/6476947de2b20e39848cb8f607ebd1189d782c77/src/module/parse-elem-html.ts#L11

这个没看懂他具体可以怎么用,这边也是用的这个插件,但是这个方法貌似是在编辑区域,进行格式转换的一个方法

是的,解析对应 dom 元素获取属性,返回 children content 格式

image
image
zai在走到这里的时候图片会显示出来

@zyj2077
Copy link
Author

zyj2077 commented Oct 24, 2024

但是没找到相对应的处理代码

@cycleccc
Copy link
Owner

去找 下载的插件里对应的 parseElemsHtml 代码

@cycleccc cycleccc linked a pull request Oct 28, 2024 that will close this issue
5 tasks
@cycleccc
Copy link
Owner

添加了 float image 插件 https://www.npmjs.com/package/@wangeditor-next/plugin-float-image

@cycleccc
Copy link
Owner

给 wangEditor float image plugin 提了 pr hqwlkj/wangEditor-plugin-float-image#13

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants