hom
hommilyeditor
npm i hommilyeditor
hom

hommilyeditor

React rich text editor built using Draft.js

by 不求圣剑

3.2.3 (see all)License:ISCTypeScript:Not Found
npm i hommilyeditor
Readme

Hommily-Editor

一款基于 facebook 开源项目Draft.js 的react 富文本编辑器

支持

站在巨人的肩膀上

示例

访问 http://suyulin.github.io/Hommily-Editor

安装

$ npm install hommilyeditor --save   

使用

import React, { Component } from 'react';
import PropTypes from 'prop-types';
import HommilyEditor from 'HommilyEditor';
class Test extends Component {

  constructor(props, context) {
    super(props, context);
    this.click = this.click.bind(this);
  }
  click(){
    const editor = this.refs.editor;

    console.log(editor.getFirstBlockText()) 拿第一段文本
    console.log(editor.getPlainText()) 拿到纯文本
    console.log(editor.saveHandle()) 拿到编辑器html内容
      //const  html = ""; 这里必须是 editor.saveHandle() 的返回值
    //editor.editHandle(html) 从html内容恢复编辑器内容
    //editor.onFocus()  得到焦点
  }
  uploadImg(file,callback) {
  // file 是 inputfile对象 需要上传以后,拿到 图片的url 传给callback
     const fileUrl = "http://tupian.enterdesk.com/2013/lxy/12/9/3/1.jpg"
     callback(fileUrl)
  }   
  render() {
    return <div> <HommilyEditor ref="editor" documentId="app" uploadImg = {this.uploadImg} />
    <button onClick={this.click}>点我呀</button> </div>;
  }
}
export default Test;

main.js 

ReactDOM.render(
  <RichEditorExample />,
  document.getElementById('app')
)

Downloads/wk

9

GitHub Stars

59

LAST COMMIT

6yrs ago

MAINTAINERS

1

CONTRIBUTORS

0

OPEN ISSUES

6

OPEN PRs

0
VersionTagPublished
3.2.3
latest
6yrs ago
No alternatives found
No tutorials found
Add a tutorial
No dependencies found

Rate & Review

100
No reviews found
Be the first to rate