Vue-bulma-text-editor NPM

vue-bulma-text-editor

npm

Setup

Install

$ npm install vue-bulma-text-editor --save

Use

    import vueBulmaTextEditor from 'vue-bulma-text-editor';
    Vue.component('vue-bulma-text-editor', vueBulmaTextEditor);

HTML

<div id='main'>
    <vue-bulma-text-editor v-model='value'/>
</div>

API

props

name	type	default	description
value	String		Initial markdown value
field	String	content	Will set hidden form fields field (html) and field_markdown (markdown)
height	Integer	500	input and previuw height in px
markdownLimit	Int	0	Sets the limit of characters on markdown, 0 disabled
showMarkdownCounter	Boolean	true	Toggle character counter for markdown at bottom
htmlLimit	Int	0	Sets the limit of characters on html, 0 disabled
showHtmlCounter	Boolean	true	Toggle character counter for htmlat bottom
toolbar	Array	see below	Sets toolbar layout, must be array of arrays

toolbar: [
  ['undo', 'redo'],
  ['bold', 'italic', 'underline', 'strikethrough', 'mark'],
  ['header'],
  ['ol', 'ul'],
  ['superscript', 'subscript'],
  ['image', 'link', 'video_youtube', 'video_vimeo'],
  ['code', 'hr', 'table', 'quote']
]