更新记录

1.1(2022-04-02) 下载此版本

修复一些体验上的问题

1.0(2020-04-18) 下载此版本


平台兼容性

Vue2 Vue3
×
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
app-vue × × × × × ×
钉钉小程序 快手小程序 飞书小程序 京东小程序
× × × ×
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari
× × × × × × × × ×

jin-edit 基于editor的富文本编辑器

兼容性

这是一个uni-app的通用组件,兼容微信小程序端、安卓端、ios端(未测试)、H5端。作者因没有ios设备无法对ios端进行测试,其他端测试无问题。

微信小程序 APP H5

我的HbuilderX版本2.6.7,不同的版本可能会造成不兼容的问题。

使用方式

  1. 将此组件进入你的项目中的 /components/ 目录中
  2. 在某个页面中使用该插件

    • script 中引用组件

      import jinEdit from '../../components/jin-edit/jin-edit.vue';
      export default {
      data() {
      return {
      
      }
      },
      components: {
      jinEdit
      },
      methods: {
      // 点击发布
      editOk(res) {
          console.log(res);
      }
      }
      }
    • template 中使用组件
      <jinEdit placeholder="请输入内容" @editOk="editOk" uploadFileUrl="/#"></jinEdit> 

Demo

uni-jin(一个uni-app组件集合)

参数

属性 类型 默认值 说明
showImgSize Boolean false 点击图片时显示图片大小控件
showImgToolbar Boolean false 点击图片时显示工具栏控件
showImgResize Boolean false 点击图片时显示修改尺寸控件
placeholder String '' 编辑器占位符
uploadFileUrl String '#' 图片上传的服务器地址
fileKeyName String 'file' 图片上传时的name
header Object - 图片上传http请求的header
html String - 初始化的html
height String - 组件高度

方法

方法名 参数 说明
editOk e={html,text,delta,isPublic} 点击发布按钮触发

以上

如何解决编辑器聚焦时,底部操作栏无法附在软键盘上方的问题

可在pages.json中加入如下配置:

"globalStyle": {
        "app-plus": {
            "softinputMode": "adjustResize"
        }
    },

如有问题,可在此提问

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

上传图片

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问