programing

vuejs - 구성 요소를 변수에 저장합니다.

projobs 2022. 8. 28. 23:34
반응형

vuejs - 구성 요소를 변수에 저장합니다.

그래서 저는 React 배경에서 왔는데 어떻게 하면 이 대사를 흉내낼 수 있을까 고민했어요.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>

Vue에서는 Dynamic Components https://vuejs.org/v2/guide/components.html#Dynamic-Components 라고 불립니다.

주어진 질문으로 봤을 때, 여러분은<component :is="modal.body"></component>템플릿에 추가해 주세요.오브젝트를 할당하는 것이 아니라 키(문자열)를 할당한다.componentsVue 인스턴스 내의 변수.예.modal.body = "Login"

언급URL : https://stackoverflow.com/questions/46701108/vuejs-saving-component-to-variable

반응형