Компонент vue, используемый внутри окна сообщений ElementUI, не может получить доступ к хранилищу vuex

Я пытаюсь использовать окно сообщения elementUI вместе с простым компонентом. компонент должен просто получить доступ к хранилищу и представить имя пользователя:

// 'MyCmp.vue'
<template>
  <div>
    <p>Name: {{fullname}}</p>
  </div>
</template>

<script>
export default {
  computed: {
    fullname() {
      return this.$store.getters.fullname;
    }
  }
};
</script>

но проблема в том, что я вижу жестко закодированную строку: "Имя" внутри поля, но не могу получить доступ к $store так как this является undefined, вот полный код моего окна сообщения:

showMessageBox(userAction) {
  const h = this.$createElement;
  MessageBox.prompt(this.$t("insertEmail"), {
    message: h(myCmp, {key: this.key++}))
  })
    .then(({ value }) => {
      console.log("in");
      MessageBox.message({
        type: "success",
        message: "yourEmailIs" + value
      });
    })
    .catch(() => {
      console.log("error");
      MessageBox.message({
        type: "info",
        message: "cancel"
      });
    });
}

я ожидал, что он будет работать в соответствии с документами и этими официальными документами, которые они предоставляют, и я следовал во время реализации. любая идея, почему я не могу получить доступ к $store/ this не определено внутри компонента?

ОБНОВЛЕНИЕ: jsfiddle

0 ответов

Другие вопросы по тегам