Slate-vue

An implement for slate supported vue2 and vue3（in development）. Most of the slate-react's components can be easily migrated by no code change.

All slate-react's example is supported now.

For principles's question, Please read slate's docs first!

Install

in npm

npm install slate-vue

in yarn

yarn add slate-vue

Usage

import

import Vue from 'vue'
import { SlatePlugin } from 'slate-vue';
Vue.use(SlatePlugin)

use

<template>
  <Slate :value="value">
    <Editable placeholder="Enter some plain text..."></Editable>
  </Slate>
</template>

<script>
  import {Slate, Editable} from 'slate-vue'

  // this value is for editor
  const initialValue = [
    {
      children: [
        { text: 'This is editable plain text, just like a <textarea>!' },
      ],
    },
  ]
  export default {
    name: 'index',
    components: {
      Slate,
      Editable
    },
    data() {
      return {
        value: JSON.stringify(initialValue)
      }
    }
  };
</script>

See full vue2.x document in slate-vue

Examples

See all examples in online example.

See all example code in pages

Issues

You can use this codesandbox template to reproduce problems.

Environment Support

IE / Edge	Firefox	Chrome	Safari
testing	testing	86.0+	testing