The Delightful World of Vue
v-bind: Dynamic Attributes
  Start your All-Access Pass to unlock this challenge
Buy Access Login

Challenge 1 / 2

Suppose we have a component named TitleComponent that is ready to be used. This component accepts a title prop and we want to populate it with the value of an imaginary data key called categoryName. Our main component looks like this:

<template>
    <title-component />
</template>

<script>
import TitleComponent from '@/components/title-component';

export default {
    name: 'MainComponent',
    components: {
        TitleComponent
    },
    data() {
        return {
            categoryName: 'Broken Cups',
        }
    },
};
</script>

How would you pass this value down to a property of title-component using the shortcut syntax?

Skip challenges and go to theNext Chapter

Turn Challenges Off?

All further challenges will be skipped automatically.
You can re-enable challenges at any time on this page or from your account page.