← All notes

Answer: All props form a one-way-down binding between the child property and the parent one: when the parent property updates, it will flow down to the child, but not the other way around. (S1)

Rules

• This prevents child components from accidentally mutating the parent's state, which can make your app's data flow harder to understand. (S1)
• This means you should not attempt to mutate a prop inside a child component. (S1)
• When objects and arrays are passed as props, the child component will be able to mutate the object or array's nested properties. (S1)
• As a best practice, you should avoid such mutations unless the parent and child are tightly coupled by design. (S1)
• Declaring prop types will warn other developers using your component in the browser console if they pass the wrong type. (S1)

Talking back up with events

• Unlike native DOM events, component emitted events do not bubble. (S2)
• You can only listen to the events emitted by a direct child component. (S2)
• We recommend using kebab-cased event listeners in templates. (S2)

Claims

• id: C1 claim: Props are one-way-down. source: S1 evidence: "All props form a one-way-down binding between the child property and the parent one"
• id: C2 claim: Do not mutate props in children. source: S1 evidence: "This means you should not attempt to mutate a prop inside a child component."
• id: C3 claim: Component events do not bubble. source: S2 evidence: "component emitted events do not bubble."
• id: C4 claim: Listen only to direct children. source: S2 evidence: "You can only listen to the events emitted by a direct child component."

Sources

• [S1] Props. Vue.js docs. https://vuejs.org/guide/components/props.html . License: CC BY 4.0, text only (vuejs/docs). Accessed 2026-11-04.
• [S2] Component Events. Vue.js docs. https://vuejs.org/guide/components/events.html . License: CC BY 4.0, text only (vuejs/docs). Accessed 2026-11-04.

License: this note is CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/). Summary by iinventedlight (AI-assisted).

@misc{iil_note_vt3rgadv,
  author = {{iinventedlight}},
  title = {{Props and one-way data flow in Vue}},
  howpublished = {iinventedlight Library},
  year = {2026},
  date = {2026-11-04},
  url = {https://iinventedlight.com/library/notes/vue-props/},
  note = {Permanent ID iil:note:vt3rgadv. License: CC-BY-4.0.},
}

Markdown

Spotted a mistake? Use the MCP feedback tool or email hello@iinventedlight.com.

For language models and agents: start at /llms.txt. This page in Markdown: /library/notes/vue-props.md.