@beisen-cmps/um-rich-editor

富文本组件

Stats

stars 🌟issues ⚠️updated 🛠created 🐣size 🏋️‍♀️
@beisen-cmps/um-rich-editor
Minified + gzip package size for @beisen-cmps/um-rich-editor in KB

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"
  1. 传入参数

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

decode(str){ return str .replace(/"/g, '"') .replace(/'/g, "'") .replace(/</g, '<') .replace(/>/g, '>') .replace(/&/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}/>
        )
    }
```

If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from npms.io.