V
V
Viktor Yanyshev2019-01-12 16:19:38
Vue.js
Viktor Yanyshev, 2019-01-12 16:19:38

Vue-meta overwrites TITLE if there are nested components, why?

By url / , a component is used where there is a nested About component that overwrites the title . It turns out that on the main page the title = "About me", instead of "Artist-ceramist". For this I am using vue-meta

Home Component:
<template>
    <div>
        <div class="welcome">
            <img src="//via.placeholder.com/1920x720?text=Slide_1 1920x720" class="img-responsive">
            <a href="#" class="btn btn-fill">Хочу записаться</a>
        </div>

        <about></about>
    </div>
</template>

<script>
    import About from './About'

    export default {
        name: 'Home',
        components: { About },
        metaInfo: {
            title: 'Художник-керамист',
        }
    }
</script>

About Component:
<script>
    export default {
        name: 'About',
        metaInfo: {
            title: 'Обо мне'
        }
    }
</script>

How can this problem be solved?

Answer the question

In order to leave comments, you need to log in

1 answer(s)
0
0xD34F, 2019-01-12
@0xD34F Vue.js

Because it 's designed like this :

Child components that have metaInfowill recursively merge them metaInfointo the parent context, overwriting any duplicate properties.

How can this problem be solved?

Do not nest one component within another.

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question