Skip to content

Close immediately after opening #45

Description

@GoodwinGuo

Thanks

Hi. Many thanks to StackEdit and stackedit.js! They are all great works!

Problem

I trying to use it in my Vue2 project according to the documentation below.
stackedit.js

It always closes immediately after opening.

like this.

StackEdit js

Code

stackedit.js version: "stackedit-js": "^1.0.7",.

Vue code

<template>
  <div>
    <div>
      <button type="primary" @click="newMarkdown">New MarkDown</button>
    </div>
    <div>
      <textarea>Hello **Markdown** writer!</textarea>
    </div>
  </div>
</template>

<script>
import Stackedit from 'stackedit-js';

export default {
  components: {
  },
  data() {
    return {
      
    };
  },
  methods: {
    newMarkdown() {
      const el = document.querySelector('textarea');
      const stackedit = new Stackedit();

      // Open the iframe
      stackedit.openFile({
        name: 'Filename', // with an optional filename
        content: {
          text: el.value // and the Markdown content.
        }
      });

      // Listen to StackEdit events and apply the changes to the textarea.
      stackedit.on('fileChange', (file) => {
        el.value = file.content.text;
      });
    },
  },
  mounted() {

  },
};
</script>
<style lang="scss" scoped>
</style>

Problem code

I suspect the cause of the problem is here.

    // Add message handler
    this.$messageHandler = (event) => {
      console.log(event);
      if (event.origin === this.$origin && event.source === iframeEl.contentWindow) {
        switch (event.data.type) {
          ...
          default:
            this.close();
        }
      }
    };

There's a message there that triggers close.

message

Suggested solutions

src\index.js

    // Add message handler
    this.$messageHandler = (event) => {
      if (event.origin === this.$origin && event.source === iframeEl.contentWindow && event.data && event.data.type) {
        ...
      }
    };

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions