更新react vue的说明

wangfupeng1988 · wangfupeng1988 · commit 10de46124bad · 2017-06-11T20:01:37.000+08:00
diff --git a/.gitignore b/.gitignore
@@ -1,5 +1,6 @@
 
 #忽略
+**/node_modules/*
 node_modules/*
 npm-debug.log
 
diff --git a/README.md b/README.md
@@ -18,7 +18,7 @@
 - 直接下载：[https://github.com/wangfupeng1988/wangEditor/releases](https://github.com/wangfupeng1988/wangEditor/releases)
 - 使用`npm`下载：`npm install wangeditor` （注意 `wangeditor` 全部是**小写字母**）
 - 使用`bower`下载：`bower install wangEditor` （前提保证电脑已安装了`bower`）
-- 使用CDN：[//unpkg.com/wangeditor@3.0.1/release/wangEditor.min.js](https://unpkg.com/wangeditor@3.0.1/release/wangEditor.min.js)（其中`@3.0.1`代表了`npm`中发布的版本）
+- 使用CDN：[//unpkg.com/wangeditor/release/wangEditor.min.js](https://unpkg.com/wangeditor/release/wangEditor.min.js)
 
 
 ## 使用
diff --git a/docs/dev/README.md b/docs/dev/README.md
@@ -16,11 +16,11 @@
 
 上线
 
-- 修改`package.json`版本，修改 unpkg 链接中的版本（文档中有两处）修改`in-react`和`in-vue`中的`wangeditor`版本
+- 修改`package.json`版本
 - 提交到github，并创建tag
 - 提交到 npm
-- 同步到官网
-- 更新文档
+- 同步到官网 min.js
+- 更新 .md 文档
 - 文档同步到 kancloud
 - ……
 
diff --git a/docs/usage/01-getstart/01-demo.md b/docs/usage/01-getstart/01-demo.md
@@ -3,7 +3,7 @@
 ## 下载
 
 - 点击 [https://github.com/wangfupeng1988/wangEditor/releases](https://github.com/wangfupeng1988/wangEditor/releases) 下载最新版。进入`release`文件夹下找到`wangEditor.js`或者`wangEditor.min.js`即可
-- 使用CDN：[//unpkg.com/wangeditor@3.0.1/release/wangEditor.min.js](https://unpkg.com/wangeditor@3.0.1/release/wangEditor.min.js)（其中`@3.0.1`代表了`npm`中发布的版本）
+- 使用CDN：[//unpkg.com/wangeditor/release/wangEditor.min.js](https://unpkg.com/wangeditor/release/wangEditor.min.js)
 - 使用`bower`下载：`bower install wangEditor` （前提保证电脑已安装了`bower`）
 
 *PS：支持`npm`安装，请参见后面的章节*
diff --git a/docs/usage/05-other/06-vue.md b/docs/usage/05-other/06-vue.md
@@ -3,5 +3,5 @@
 如果需要将 wangEditor 用于 Vue 中，可参见如下示例
 
 - 下载源码 `git clone git@github.com:wangfupeng1988/wangEditor.git`
-- 进入 vue 示例目录 `cd wangEditor/example/demo/in-vue/`，查看`src/App.js`即可
+- 进入 vue 示例目录 `cd wangEditor/example/demo/in-vue/`，查看`src/components/Editor.vue`即可
 - 也可以运行`npm install && npm run dev`查看在 vue 中的效果（`http://localhost:8080/`）
diff --git a/example/demo/in-react/package.json b/example/demo/in-react/package.json
@@ -5,7 +5,7 @@
   "dependencies": {
     "react": "^15.5.4",
     "react-dom": "^15.5.4",
-    "wangeditor": "^3.0.1"
+    "wangeditor": ">=3.0.0"
   },
   "devDependencies": {
     "react-scripts": "1.0.7"
diff --git a/example/demo/in-react/src/App.js b/example/demo/in-react/src/App.js
@@ -7,6 +7,7 @@ class App extends Component {
   constructor(props, context) {
       super(props, context);
       this.state = {
+        editorContent: ''
       }
   }
   render() {
@@ -19,24 +20,28 @@ class App extends Component {
         <p className="App-intro">
           To get started, edit <code>src/App.js</code> and save to reload.
         </p>
+
+        {/* 将生成编辑器 */}
         <div ref="editorElem" style={{textAlign: 'left'}}>
         </div>
+
         <button onClick={this.clickHandle.bind(this)}>获取内容</button>
       </div>
     );
   }
   componentDidMount() {
     const elem = this.refs.editorElem
     const editor = new E(elem)
+    // 使用 onchange 函数监听内容的变化，并实时更新到 state 中
+    editor.customConfig.onchange = html => {
+      this.setState({
+        editorContent: html
+      })
+    }
     editor.create()
-
-    this.setState({
-        editor: editor
-    })
   }
   clickHandle() {
-      const editor = this.state.editor
-      alert(editor.txt.html())
+      alert(this.state.editorContent)
   }
 }
 
diff --git a/example/demo/in-vue/package.json b/example/demo/in-vue/package.json
@@ -11,7 +11,7 @@
   },
   "dependencies": {
     "vue": "^2.3.3",
-    "wangeditor": "^3.0.1"
+    "wangeditor": ">=3.0.0"
   },
   "devDependencies": {
     "autoprefixer": "^6.7.2",
diff --git a/example/demo/in-vue/src/components/Editor.vue b/example/demo/in-vue/src/components/Editor.vue
@@ -12,19 +12,20 @@
       name: 'editor',
       data () {
         return {
+          editorContent: ''
         }
       },
       methods: {
         getContent: function () {
-            var editor = this.editor
-            alert(editor.txt.html())
+            alert(this.editorContent)
         }
       },
       mounted() {
         var editor = new E('#editorElem')
+        editor.customConfig.onchange = (html) => {
+          this.editorContent = html
+        }
         editor.create()
-
-        this.editor = editor
       }
     }
 </script>
