# @beisen-cmps/um-rich-editor

> 富文本组件

Latest version **0.0.10** (published 2018-06-26) · ISC license · 0 weekly downloads

## Install

```sh
npm install @beisen-cmps/um-rich-editor
pnpm add @beisen-cmps/um-rich-editor
yarn add @beisen-cmps/um-rich-editor
bun add @beisen-cmps/um-rich-editor
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.10 |
| Published | 2018-06-26 |
| First published | 2018-05-16 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 6 |
| Unpacked size | 2.2 MB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | beisen |
| Maintainers | beisencorp |

## Links

- npm: https://www.npmjs.com/package/@beisen-cmps/um-rich-editor
- Repository: http://gitlab.beisencorp.com/ux-cnpm/ux-richeditor
- npm.io page: https://npm.io/package/@beisen-cmps/um-rich-editor

## Dependencies (6)

- [etpl](https://npm.io/package/etpl.md) ^3.2.0
- [react](https://npm.io/package/react.md) ^15.6.2
- [jquery](https://npm.io/package/jquery.md) ^3.3.1
- [debounce](https://npm.io/package/debounce.md) ^1.1.0
- [react-dom](https://npm.io/package/react-dom.md) ^15.6.2
- [@beisen-cmps/common-label](https://npm.io/package/@beisen-cmps/common-label.md) 0.0.2

## Recent versions

- 0.0.10 (latest) — 2018-06-26
- 0.0.9 — 2018-05-17
- 0.0.8 — 2018-05-17
- 0.0.7 — 2018-05-17
- 0.0.6 — 2018-05-17
- 0.0.5 — 2018-05-17
- 0.0.4 — 2018-05-17
- 0.0.3 — 2018-05-17
- 0.0.2 — 2018-05-17
- 0.0.1 — 2018-05-16

## README

# richeditor 使用说明

## 项目运行

1. cnpm install 或 npm install cnpm使用教程

2. npm run dev （开发环境打包 port:8080）

3. npm run test （测试用例）

4. npm run build （生产环境打包）

## richeditor参数

```

	  value:this.decode("<p><a href="https://www.baidu.com/" target="_blank" title="bd">bd</a><br/></p>"),  //富文本内显示的值
    name: "测试",
    required: true,  //必填
    errorStatus: true, //是否报错
    errorMsg: "出错了~~~！", //报错信息
    helpMsg:"dqwdqw",  //帮助信息
    sideTip:false ,//toolTip是否左右显示
    hiddenTip:false, //toolTip是否显示
    editStatus : true,  //是否可编辑，只读状态(readonly)
    lablePos: false, //label位置，true时在左边，false在上边
    lableTxt: false, //label中文字对齐方式，true左对齐，false右对齐
    onChange : function(value,haveContet){
      self.onChange(value,haveContet)
    }

```

## richeditor调用方法

1.安装npm组件包

```
npm install @beisen/richeditor --save-dev
```

2.引用组件

  ```
import BaseButton from "@beisen/richeditor"
  ```


3. 传入参数

	该参数为上述参数，传入方式使用: {...参数}
	```

  decode(str){
    return str
      .replace(/"/g, '"')
      .replace(/'/g, "'")
      .replace(/&lt;/g, '<')
      .replace(/&gt;/g, '>')
      .replace(/&amp;/g, '&');
  } 

	 let options ={
      value:this.decode("&lt;p&gt;&lt;a href=&quot;https://www.baidu.com/&quot; target=&quot;_blank&quot; title=&quot;bd&quot;&gt;bd&lt;/a&gt;&lt;br/&gt;&lt;/p&gt;"),
      videoType: [".mp4"], //视频预览格式，默认只有".swf",".flv",".wmv"
      name: "测试",
      required: true,
      errorStatus: true, //是否报错
      errorMsg: "出错了~~~！", //报错信息
      helpMsg:"dqwdqw",
      sideTip:false ,//toolTip是否左右显示
      hiddenTip:false, //toolTip是否显示
      editStatus : true,
      lablePos: false, //label位置，true时在左边，false在上边
      lableTxt: false, //label中文字对齐方式，true左对齐，false右对齐
      onChange : function(value,haveContet){
        self.onChange(value,haveContet)
      }
    }

	render () {
			return (
				 <UmRichEditor id="richeditor" {...options}/>
			)
		}
	```

---
_Source: https://npm.io/package/@beisen-cmps/um-rich-editor · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._