vuejs - composante d'économie à la variable

Question

donc je viens d'une React fond et je me demandais comment je pouvais imiter cette ligne: var modal = <Login/>

Voici ce que j'ai jusqu'à présent, mais la sortie de la variable est une chaîne à la place:

<template src="./App.html"></template> 

<script> 
    import 'jquery' 
    import 'uikit' 
    import 'uikit/dist/css/uikit.min.css' 

    import Login from '@/Login.vue' 
    import Register from '@/Register.vue' 

    export default { 
    name: 'app', 
    components: { 
     "Login": Login, 
     "Register": Register 
    }, 
    data: function() { 
     return { 
      message: "first", 
      modal: { 
       body: "test", 
       title: "body" 
      } 
     } 
    }, 
    methods: { 
     modal_open: function(type) { 
      if (type === "login") 
      { 
       this.modal = { 
        body: Login, 
        title: "login" 
       } 
      } 
      else 
      { 
       this.modal = { 
        body: Register, 
        title: "Register" 
       } 
      } 
     }, 
    } 
    } 
</script> 

Answer 1

donc, dans c'est Vue apparemment appelé des composants dynamiques https://vuejs.org/v2/guide/components.html#Dynamic-Components

de la question donnée, vous devriez avoir <component :is="modal.body"></component> dans votre modèle. Et plutôt que d'affecter un objet, vous affectez la clé (chaîne) à partir de la variable components dans l'instance de Vue. Par exemple. modal.body = "Login"