https://github.com/ianho/xing-weapp-editor

开箱即用的微信小程序图文编辑组件
https://github.com/ianho/xing-weapp-editor

javascript rich-text-editor weapp weixin

Last synced: 4 months ago
JSON representation

开箱即用的微信小程序图文编辑组件

• Host: GitHub
• URL: https://github.com/ianho/xing-weapp-editor
• Owner: ianho
• License: mit
• Created: 2018-08-09T01:55:24.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2020-06-17T09:45:26.000Z (over 5 years ago)
• Last Synced: 2024-07-02T04:45:17.302Z (over 1 year ago)
• Topics: javascript, rich-text-editor, weapp, weixin
• Language: JavaScript
• Homepage:
• Size: 907 KB
• Stars: 105
• Watchers: 7
• Forks: 15
• Open Issues: 8
• Metadata Files:
  • Readme: README.md
  • License: LICENSE.md

Awesome Lists containing this project

• awesome-wechat-weapp - xing-weapp-editor - 小程序图文编辑组件 (组件)
• awesome-wechat-app - xing-weapp-editor - 小程序图文编辑组件 (组件)
• awesome-wechat-app - xing-weapp-editor - 小程序图文编辑组件 (组件)
• awesome-wechat-weapp - xing-weapp-editor - 小程序图文编辑组件 (组件)

README

          
⚠️ 太久没空更新，不确定是否可用

# xing-weapp-editor

> 开箱即用的小程序图文编辑组件

## 代码片段

[https://developers.weixin.qq.com/s/adp5u9mk7H6w](https://developers.weixin.qq.com/s/adp5u9mk7H6w)

## 效果预览

![](https://raw.githubusercontent.com/ianho/xing-weapp-editor/master/assets/editor.gif)

## 组件属性

属性名|类型|默认值|说明

---|---|---|---

image-upload-url|String|无|图片上传，必填，参考[wx.uploadFile](https://developers.weixin.qq.com/miniprogram/dev/api/network-file.html#wxuploadfileobject)

image-upload-name|String|无|图片上传，必填，参考[wx.uploadFile](https://developers.weixin.qq.com/miniprogram/dev/api/network-file.html#wxuploadfileobject)

image-upload-header|String|无|图片上传，参考[wx.uploadFile](https://developers.weixin.qq.com/miniprogram/dev/api/network-file.html#wxuploadfileobject)

image-upload-form-data|Object|无|图片上传，参考[wx.uploadFile](https://developers.weixin.qq.com/miniprogram/dev/api/network-file.html#wxuploadfileobject)

image-upload-key-chain|String|无|图片上传接口返回值中url字段的路径，如返回为`{ image : { url: 'http://xxx.jpg' } }`，则填`image.url`

output-type|String|html|输出的格式，`html`或`array`，参考[rich-text](https://developers.weixin.qq.com/miniprogram/dev/component/rich-text.html)

button-background-color|String|#409EFF|完成按钮的背景色

button-text-color|String|#fff|完成按钮的前景色

nodes|Array|无|初始内容的array形式，仅支持此组件输出的array，优先于HTML

html|String|无|初始内容的HTML形式，仅支持此组件输出的HTML

bindfinish|EventHandle|无|输出内容时触发，`event.detail = { content }`

## 代码示例

```xml

```

```javascript

//index.js

Page({

  data: {

    html: '
123124

123124123


324123
' +

    '' +

    '
333
' +

    '',

  },


  finish: function (e) {

    console.log(e.detail.content);

  },

})

```

```javascript

{

  "usingComponents": {

    "xing-editor": "/components/xing-editor"

  }

}

```

## TODO List

- □ 文字格式编辑

- □ 图片免上传（转Base64存储）

- □ 编辑预览