Simple and lightweight Trix rich-text editor component for Vue.js

Demo page

NPM

  $npm install --save vue-trix

YARN

  $yarn add vue-trix

in the main.js, import the package as a global component.

  import 'vue-trix'

  import VueTrix from 'vue-trix'

  export default {
    // ...
    components: {
      VueTrix
    }
  }

Add VueTrix component into *.vue template

  <template>
    <!-- ... -->
    <VueTrix v-model="editorContent"/>
    <!-- ... -->
  </template>

  <form ...>
    <VueTrix inputId="editor1" v-model="editorContent"/>
  </form>

• inputId: This is referenced id of the hidden input field defined

Full documentation