slate-vue icon indicating copy to clipboard operation
slate-vue copied to clipboard

Cannot set property 'children' of undefined

Open Envov opened this issue 3 years ago • 4 comments

image

Envov avatar Jun 07 '21 03:06 Envov

<template>
  <Slate :value="JSON.stringify(value)">
    <Editable :renderLeaf="renderLeaf" :renderElement="renderElement">
    </Editable>
  </Slate>
</template>

<script>
import PageBox from "c/PageBox";

import { Slate, Editable } from "slate-vue";


export default {
  components: { PageBox, Slate, Editable },
  data() {
    return {
      value: [
        {
          type: "h1",
          children: [{ text: "12121" }],
        },
      ],
    };
  },
  created() {
    //  console.log(this.value);
    //    this.$editor.children=this.value
    // console.log(this.$editor);
  },
  methods: {
    renderLeaf({ attributes, children, leaf }) {
      return {
        render() {
          return <span {...{ attrs: attributes }}>{children}</span>;
        },
      };
    },
    renderElement({ attributes, children, element }) {
      console.log({ attributes, children, element });
      return {
        render() {
          return (
            <div {...{ attrs: attributes }} element={element}>
              {children}
            </div>
          );
        },
      };
    },
  },
};
</script>

<style>
</style>

Envov avatar Jun 07 '21 03:06 Envov

main.js

import Vue from "vue";
import 'babel-polyfill'
import { SlatePlugin } from 'slate-vue';
import { withHistory } from 'slate-history'
Vue.use(SlatePlugin, {
  editorCreated(editor) {
    withHistory(editor);
  },
});

...

Envov avatar Jun 07 '21 03:06 Envov

So there was never an answer? Same problem here

NeroZonbolt avatar Apr 28 '23 16:04 NeroZonbolt

So there was never an answer? Same problem here

I've switched to tiptap, Everything is nice

Envov avatar May 04 '23 07:05 Envov