richeditor 使用说明

项目运行

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

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

3. npm run test （测试用例）

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

注意

• 该组件插入视频仅支持mp4格式，win7下由于系统限制，最小支持48x48,最大支持1920x1088

richeditor参数

     id:"richeditor", //唯一标示，必须
	  value:this.decode("<p><a href="https://www.baidu.com/" target="_blank" title="bd">bd</a><br/></p>"),  //富文本内显示的值
    videoConfig: { //视频相关配置
        autoplay: true, //自动播放，默认false
        loop: true //循环播放，默认false
      },
    name: "测试",
    toolbar:[
            'source | undo redo | bold italic underline strikethrough | forecolor | fullscreen |',
            'insertorderedlist insertunorderedlist | cleardoc removeformat | fontfamily fontsize' ,
            '| justifyleft justifycenter justifyright justifyjustify indent outdent |',
            'link unlink | image video music',
            '| horizontal preview inserttable ',
        ], //自定义工具栏
    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右对齐
    imageUrl: "https://demo-cloud.italent.link/api/v2/Data/File/",  //本地上传时的上传地址，默认为当前页面地址
    parameter: "app=BeisenCloudDemo&metaObjName=BeisenCloudDemo.ceshi0602",  //本地上传时的参数，开头不加 & 
    localUpload: true, //开启本地上传功能
    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(/</g, '<') .replace(/>/g, '>') .replace(/&/g, '&'); }

 let options ={
  value:this.decode("<p><a href="https://www.baidu.com/" target="_blank" title="bd">bd</a><br/></p>"),
  videoConfig: { //视频相关配置
    autoplay: true, //自动播放，默认false
    controls: true, //视频工具条，默认true
    loop: true //循环播放，默认false
  },
  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}/>
		)
	}
```