Добавление или внедрение HTML или компонента в компонент Vue, созданный во время выполнения - PullRequest
Новая
       10

Добавление или внедрение HTML или компонента в компонент Vue, созданный во время выполнения

1 голос
/ 09 июля 2020

У меня есть приложение Vue, в котором я беру кучу файлов уценки и превращаю их в компоненты, которые генерируются динамически, а ссылки на которые обрабатываются Vue Router. Я загружаю свою уценку, используя this Vue загрузчик уценки.

Основной файл маршрута выглядит так: 

import RamblePosts from "@/assets/rambles/rambles.json"; // Simple JSON that contains the name of the markdown documents

...RamblePosts.map(entry => ({
    path: `/${entry}`,
    name: entry,
    component: () => import(`@/assets/rambles/${entry}.md`)
}))
];

Как видите, я ' m генерирует компоненты на основе файлов уценки, которые у меня есть в этом каталоге.

Пример использования: 

<template>
    <div class="wrapper-div rambling-wrapper">
        <div class="ramble-cards-wrapper">
            <RambleCard
                v-for="route in rambleList"
                :key="route.title"
                :title="route.title"
                :subtitle="route.subtitle"
                :ramble-url="route.url"
            />
        </div>
    </div>
</template>

<script>
    import RambleCard from "@/components/RambleCard";
    import rambleList from "@/assets/rambles/rambleList.json";

    export default {
        components: {
            RambleCard
        },
        data() {
            return {
                rambleList
            };
        }
    };
</script>

Это простой элемент карты, который просто отображает имя записи уценки, подзаголовок и ссылку vue -router для него. Щелкнув ссылку, вы попадете в соответствующую статью, например, что-то вроде url.com/foo

Есть ли у меня способ каким-то образом редактировать или манипулировать этими компонентами уценки и добавлять к ним, скажем, компонент Vue или даже просто HTML? Поскольку они генерируются динамически в, я не уверен, как подойти к этой ситуации, потому что я не могу просто подключить компонент где-нибудь в середине этих компонентов статьи.

...