Each component lives in a single file, containing:
template(the DOM structure)
methodsamong other things)
style(defining the look of the component)
Placed in the same folder are also:
- the test file (e.g.
- the storybook file (e.g.
Vue.js allows us to define component props either as strings or as objects (with
requiredvalues). Always go for the second option!
Also: only (and always!) define a
defaultfor props that are not required.
- it makes our code more robust – a warning will be shown when passing a wrong prop type
- it clearly defines the component API and tells other developers how to use it
It is as easy as writing:
For better readability we prefer