1.4.5 • Published 4 years ago

@wakeio/vue-wysiwyg v1.4.5

Weekly downloads
3
License
MIT
Repository
-
Last release
4 years ago

A fork of the MYCURE Inc. wysiwyg editor for Vue.js

Demo

Install

NPM

$ npm install @wakeio/vue-wysiwyg

Usage

As a global plugin

import Vue from 'vue';
import wysiwyg from '@wakeio/vue-wysiwyg';

Vue.use(wysiwyg);

As a local component

<template>
  <div>
    <wysiwyg v-model="html"></wysiwyg>
  </div>
</template>

<script>
import wysiwyg from '@wakeio/vue-wysiwyg';
export default {
  components: {
    wysiwyg
  },
  data () {
    return {
      html: ''
    }
  }
}
</script>

Props

height - Number - Sets the min-height of the editor container.

<wysiwyg v-model="html" :height="500"></wysiwyg>

hide - Object - Pass the object property hide to hide certain features in the editor.

Sample

In example below, strikethrough and table will be hidden.

<template>
  <div>
    <wysiwyg v-model="html" :hide="hide"></wysiwyg>
  </div>
</template>

<script>
import wysiwyg from '@wakeio/vue-wysiwyg';
export default {
  components: {
    wysiwyg
  },
  data () {
    return {
      html: '',
      hide: {
        strikethrough: true,
        table: true
      }
    }
  }
}

hide Properties

propertytypedefault
boldBooleanfalse
italicBooleanfalse
underlineBooleanfalse
strikethroughBooleanfalse
headingBooleanfalse
alignLeftBooleanfalse
alignCenterBooleanfalse
alignRightBooleanfalse
olBooleanfalse
ulBooleanfalse
urlBooleanfalse
tableBooleanfalse
indentBooleanfalse
outdentBooleanfalse