Асинхронная загрузка компонента Svelte в версии 3

Я хотел бы задать вам вопрос об обновлении простого примера с версии 2 до версии 3.

Этот пример загрузки асинхронного компонента svelte v2 работает ( https://codesandbox.io/s/0ooo3z8nqp), но этот пример написан для версии v3 ( https://codesandbox.io/s/615zv3xp33).

Любая подсказка? Спасибо!

Обновление: мой вопрос был о преобразовании следующего фрагмента кода из Svelte V2 в V3.

<script>
    export default {
      components: {},
      data() {
        return {
          ChatBox: null
        };
      },
      methods: {
        async loadChatbox() {
          const { default: ChatBox } = await import("./Chatbox.html");
          this.set({ ChatBox });
        }
      }
    };
</script>

1 ответ

Решение

В версии 3 Svelte вы можете назначить новое значение переменной напрямую, не используя set,

Вы можете назвать default к чему-то другому, чем ChatBox так что внешняя переменная не затеняется, а затем присваивается непосредственно ей.

let ChatBox;

async function loadChatBox() {
  const { default: Component } = await import("./ChatBox.svelte");
  ChatBox = Component;
}
Другие вопросы по тегам