vuejs - 変数

Question

にコンポーネントを保存するには、だから私が反応の背景から来て、私はこの行を模倣する可能性がどのように思っていた：var modal = <Login/>

は、ここで私がこれまで持っているものだが、変数の出力ではなく文字列です。

<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

だから、Vueの中でそれが明らかに与えられた質問から動的コンポーネントhttps://vuejs.org/v2/guide/components.html#Dynamic-Components

と呼ばれています、あなたはあなたのテンプレートに<component :is="modal.body"></component>を持つ必要があります。また、オブジェクトを割り当てる代わりに、Vueインスタンス内の変数componentsからキー（文字列）を割り当てます。例えば。 modal.body = "Login"