0
Vue.js · Vue.js Components
New technique
Using a component
One good mould makes a hundred blades. Write a component once, use it everywhere.
A component is a .vue file that bundles a piece of template, its logic and its style. Instead of copying the same markup into ten places, you write it once and drop it in wherever you need it.
With <script setup>, using another component takes two steps: import it, then use it as a tag. No registration needed.
<script setup> import BladeCard from './BladeCard.vue'; </script> <template> <BladeCard /> <BladeCard /> </template>
- Component names use PascalCase:
BladeCard.vue,<BladeCard />. - Each tag is a separate instance with its own state.
- Global registration with
app.component('BladeCard', BladeCard)exists too, but local imports are clearer.