@aliretail/react-materials-components/demo/PowerEditor/README.md

B 端物料组件库

---
title: PowerEditor-API
order: 1
category: UI
description: PowerEditor 组件描述
screenshot: https://gw.alicdn.com/imgextra/i2/O1CN01yW3hCD1M8CnqeKFlq_!!6000000001389-2-tps-90-90.png
---

# 富文本
> @alife/aliretail-power-editor

[![TNPM version][tnpm-image]][tnpm-url]
[![TNPM downloads][tnpm-downloads-image]][tnpm-url]

[tnpm-image]: https://npm.alibaba-inc.com/badge/v/@alife/aliretail-power-editor.svg
[tnpm-url]: https://npm.alibaba-inc.com/package/@alife/aliretail-power-editor
[tnpm-downloads-image]: https://npm.alibaba-inc.com/badge/d/@alife/aliretail-power-editor.svg

富文本输入框和默认readOnly状态

## API

该当前组件继承所有 @aliretail/react-material-selector 包中的参数

| 参数名 | 说明 | 必填 | 类型 | 默认值 | 备注 |
| ------ | ---- | ---- | ---- | ------ | ---- |
| readOnly    | 是否是只读状态(以弹窗的方式显示富文本内容)  | N | mng | false     |      |
| materialCode| 素材中心code，有设置则会调用素材中心的视频和图片选择| N | string   | ''     |      |
| path        | 包含的内容oss地址                      | N | string   | ''     |      |
| disabled    | 是否禁用                              | N | boolean  | false |      |
| readonly    | 只读状态(直接显示内容)                  | N | boolean  | false |      |
| isPreview   | 是否展示状态                           | N | boolean  |false |      |
| state       | 富文本框状态                           | N | string   | 'error'|'error'-错误 富文本框将变红|
| contentHeight| 容器高度限制                          | N | string   | 450px | |
| mode        | 生成内容类型                           | N | `'pc' 、 'mobile'` | pc |  `'pc'-pc浏览器模式 'mobile'-手机版宽度将限制在502px中` |
| FileComponentLabel | 图片上传的label                | N | string    | 图片上传 | |
| FileComponent | 点击上传图片出现的组件                | N | React.Component | |
| VideoComponent | 点击上传视频出现的组件               | N | React.Component | |
| width       | 宽度限制                              | N | string    | '100%' |  |
| value       | 内容                                 | N | string     | '' | |
| onChange    | 监听内容变化                           | N | (value: string) => void | () => void | |
| materialCenterLinkage    | 素材库中心链接相关配置 | Y | { app: string; page: string; close: boolean; refresh: boolean; } | - | |

当用户进行跳转素材中心的配置（materialCenterLinkage || api.materialAddress || linkToMaterialCenter）且 materialCode 为指定 materialCode 的话，默认跳到相关素材管理中心

| materialCode | 说明 | 跳转app code | 跳转page code |
| ------ | ---- | ---- | ---- |
| mall_portal    | 商城素材中心  | mall_portal | mng |
| retailforce_crm    | crm素材中心  | retailforce_crm | member-MediaMaterials |