Skip to content

Commit 73af99a

Browse files
committed
Updated readme and package for updating npm
1 parent 2215b3e commit 73af99a

File tree

2 files changed

+43
-25
lines changed

2 files changed

+43
-25
lines changed

README.md

Lines changed: 42 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
## Vue2-Editor
22

3+
![Vue2Editor-Centered](/Users/droyer/Desktop/Vue2Editor-Centered.png)
34
HTML Editor using Vue.js 2.0 and Quilljs
4-
<br>
5+
56
[Vue.js](https://vuejs.org)
6-
</br>
77
[Quill](http://quilljs.com/)
88

99
<!-- ## Demo -->
@@ -15,19 +15,23 @@ HTML Editor using Vue.js 2.0 and Quilljs
1515
```bash
1616
$ npm install --save vue2-editor
1717
```
18-
</br>
18+
19+
1920

2021
## Use
22+
2123
```js
2224
import { VueEditor } from 'vue2-editor'
2325
```
24-
</br>
26+
27+
2528

2629
## Props
2730

2831
**_editor-content_**:
29-
<br>
32+
3033
You can set the the content of the editor dynamically. If you don't need this feature then do not include it.
34+
3135
```html
3236
<template>
3337
<div id="app">
@@ -59,9 +63,11 @@ You can set the the content of the editor dynamically. If you don't need this fe
5963
}
6064
</script>
6165
```
62-
</br>
66+
67+
68+
6369
**_show-preview_**:
64-
</br>
70+
6571
This is set to FALSE by default. To enable:
6672

6773
```html
@@ -70,9 +76,10 @@ This is set to FALSE by default. To enable:
7076
</vue-editor>
7177
```
7278

73-
</br>
79+
80+
7481
**_editor-toolbar_**:
75-
</br>
82+
7683
If you want to use a custom toolbar then you can set it to a property from the data object.
7784

7885
```html
@@ -100,47 +107,53 @@ If you want to use a custom toolbar then you can set it to a property from the d
100107
}
101108
</script>
102109
```
103-
</br>
110+
111+
112+
104113
**_use-save-button_**:
105-
</br>
114+
106115
This is set to true by default. Set to false to use your own button.
107116

108-
</br>
117+
118+
109119
**_button-text_**:
110-
</br>
120+
111121
The default text is 'Save Content'. If you want to use the built in Save button but with different text then you can set this prop to a String.
122+
112123
```html
113124
<vue-editor
114125
button-text="Custom Save Message">
115126
</vue-editor>
116127
```
117-
</br>
128+
118129

119130

120131
## Events
121132

122133
**_editor-updated_**:
123-
</br>
134+
124135
Emitted when the editor contents change. You will want to listen for this event if using your own save button.
125136

126-
</br>
137+
138+
127139
**_save-content_**:
128-
</br>
140+
129141
Emitted when the default save button is clicked.
130142

131-
</br>
132143
## How do I get the html content from the text editor?
144+
133145
_There are 2 different scenarios we need to address._
134-
</br></br>
146+
147+
135148

136149
### 1. Using the default Save Button
137150

138-
When the button is clicked, the '**_save-content_**' event is emitted with the current contents of the editor.
139-
You need to create a method that runs when this event is emitted.
151+
When the button is clicked, the '**_save-content_**' event is emitted with the current contents of the editor.
140152

141-
You will need to pass a parameter to the method you create. This parameter holds the editor contents.
153+
You need to create a method that runs when this event is emitted and pass a parameter to this method. This parameter holds the editor contents.
142154

143155
EX:
156+
144157
```html
145158
<template>
146159
<div id="app">
@@ -163,7 +176,8 @@ export default {
163176
}
164177
</script>
165178
```
166-
</br>
179+
180+
167181

168182
### 2. Using your own button
169183

@@ -172,6 +186,7 @@ The event '**_editor-updated_**' is emitted when the text inside the editor chan
172186
You need to create a method that runs when this event is emitted.
173187

174188
EX:
189+
175190
```html
176191
<template>
177192
<div id="app">
@@ -212,7 +227,8 @@ EX:
212227
}
213228
</script>
214229
```
215-
</br>
230+
231+
216232

217233
## Example using several configuration options
218234

@@ -259,5 +275,7 @@ EX:
259275
}
260276
</script>
261277
```
278+
262279
# License
280+
263281
MIT

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "vue2-editor",
3-
"version": "1.0.92",
3+
"version": "1.0.94",
44
"description": "HTML editor using Vue.js 2.0 and Quill.js, an open source edtior",
55
"keywords": [
66
"vue",

0 commit comments

Comments
 (0)