2 相同的文件，如何在 Vue.js 中构建模板/组件 2

Question

我正在使用 Vue.js 2.0，我在 2 个不同的文件中有完全相同的代码，唯一改变的是 ID_SPECIFIC_TO_THIS_BLOCK 所以我是初学者关于 Vue，我想知道是否有一种方法可以实现一种模板，我可以为我的 2 个文件重用

您可以在下面找到一个文件的完整代码：

<template>
    <div>
        <div class="container">
            <hp-row>
                <hp-column>
                    <component v-for="component in content.column" :data="component" :key="component.id" :is="getComponentIdentifier(component.is)"></component>
                </hp-column>
            </hp-row>
        </div>
    </div>
</template>

<script>
import ModularView from '@/views/ModularView'

export default {
    name: 'AboutUsView',
    mixins: [ModularView],

    created () {
        this.fetch('blocks/ID_SPECIFIC_TO_THIS_BLOCK')
    },
}
</script>

Answer 1

使用道具：

export default {
    name: 'AboutUsView',
    mixins: [ModularView],
    props: ['ID_SPECIFIC_TO_THIS_BLOCK']
    created () {
        this.fetch(`blocks/${this.ID_SPECIFIC_TO_THIS_BLOCK}`)
    },
}

<about-us-view ID_SPECIFIC_TO_THIS_BLOCK="123"></about-us-view>
<about-us-view ID_SPECIFIC_TO_THIS_BLOCK="789"></about-us-view>