vue에서 구성 요소를 동적으로 로드하는 방법

vue에서 구성 요소를 동적으로 로드하는 방법

<template>
  <div>
    <v-container fluid id="main">
      <v-card class="white lighten-4 elevation-3">

        <li v-for="stop in stop_name_arr">
          {{stop}}
        </li>

        <direct_bus_travel_time_in_between_stops>
        </direct_bus_travel_time_in_between_stops>

        <direct_bus_travel_distance_in_between_stops>
        </direct_bus_travel_distance_in_between_stops>

      </v-card>
    </v-container>
  </div>
</template>

나는 두 가지 구성요소를 가지고 있다.direct_bus_travel_time_in_between_stops&direct_bus_travel_distance_in_between_stops다음에 싣다<li v-for="stop in stop_name_arr">{{stop}}</li>완전히 처형되었다.

기능 내부에 구성요소를 동적으로 추가하여 로딩하고자 할 때 로딩할 수 있는 방법이 있는가?

난 네가 메타 데이터를 사용할 수 있다고 생각해.component전달된 해당 구성 요소를 비동기식으로 로드하는 태그is기여하다

암호는 다음과 같다.

<component is="direct_bus_travel_time_in_between_stops" > </component> <component is="direct_bus_travel_time_in_between_stops" > </component>

이 태그에 어떤 조건으로 로드되는지 기능/이벤트를 추가할 수 있다.이 링크가 도움이 될 것 같다 - 동적으로 사용할 바인딩 컴포넌트에 대해 설명하는 https://vuejs.org/v2/guide/components.html#Dynamic-Components

내 접근이 너에게 유용했기를 바래!

업데이트: 이 답변은 vue 버전 2.x와 관련하여 제공되었다. vue 3.x를 잘 모르며 3.x 문서를 읽지 않았다.vue 3.x 호환 솔루션의 편집 초안을 항상 제출할 수 있다.고마워!

참조URL: https://stackoverflow.com/questions/45450161/how-to-load-a-component-dynamically-in-vue