跳至正文

文档对应 SoEditor 1.2.1

图片编辑

图片可以通过 URL、上传适配器或资源选择器插入。对话框可编辑替代文字、尺寸和相关属性;替换图片时保留有意义的描述。

alt 应描述图片用途。装饰图和信息图的替代文字策略不同,请由内容作者选择。宽高控制影响内容呈现,应使用真实资源尺寸。

上传进度和临时预览属于界面状态,不应写入保存的 HTML。上传接入

最小内容与预期行为

ts
export async function editImage(host: HTMLElement, trustedImageUrl: string) {
    const image = document.createElement('img');
    image.src = trustedImageUrl;
    image.alt = 'Product front view';
    return createClassicEditor(host, { data: `<p>${image.outerHTML}</p>` });
}

只向函数传入宿主已验证的图片 URL。图片上下文工具修改属性后,getData() 应返回图片 URL、替代文字和内容属性。

常见错误

图片无法显示时先检查 URL、权限和内容安全策略。上传与资源选择需要独立适配,工具栏按钮不是上传后端。

下一步

运行示例 · 配置参考 · 常见问题

面向网站 CMS 的 HTML 编辑器 · MIT