반응형
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>
템플릿에 추가해 주세요.오브젝트를 할당하는 것이 아니라 키(문자열)를 할당한다.components
Vue 인스턴스 내의 변수.예.modal.body = "Login"
언급URL : https://stackoverflow.com/questions/46701108/vuejs-saving-component-to-variable
반응형
'programing' 카테고리의 다른 글
size_t와 부호 없는 int의 차이점 (0) | 2022.08.28 |
---|---|
vue.js에서 컴포넌트의 폭을 찾는 방법 (0) | 2022.08.28 |
안드로이드의 지연은 어떻게 설정하나요? (0) | 2022.08.27 |
Vuex commit : JSON 순환 구조 오류 (0) | 2022.08.27 |
v-for 메서드에서 쉼표로 구분된 문자열 분할 (0) | 2022.08.27 |