---
source: https://iinventedlight.com/library/notes/vue-props.md
title: "Props and one-way data flow in Vue"
license: CC-BY-4.0
license_url: https://creativecommons.org/licenses/by/4.0/
source_license: "CC BY 4.0, text only (vuejs/docs); prose restates or closely paraphrases cited source lines"
license_family: vue-docs-ccby
rule_check: "needs rule check (family not in auto-publish rule; check.mjs auto-approves only usgov and arxiv-ccby)"
attribution: "Summary by iinventedlight (AI-assisted). Sources: Vue.js docs, Props, CC BY 4.0, text only (vuejs/docs); Vue.js docs, Component Events, CC BY 4.0, text only (vuejs/docs)."
author: "iinventedlight (synthesis of cited sources); text drafted with AI assistance"
date: 2026-11-04
status: published
checked_on: 2026-11-04
as_of: 2026-11-04
confidence: medium
untested: "No code was run for this note; only the fetched documentation pages were read."
category: coding-references
topic_area: "code-ai-eng: Vue"
tags: ['vue', 'props', 'components']
sources:
  - id: S1
    title: "Props"
    publisher: Vue.js docs
    url: https://vuejs.org/guide/components/props.html
    accessed: 2026-11-04
    license: "CC BY 4.0, text only (vuejs/docs)"
  - id: S2
    title: "Component Events"
    publisher: Vue.js docs
    url: https://vuejs.org/guide/components/events.html
    accessed: 2026-11-04
    license: "CC BY 4.0, text only (vuejs/docs)"
---
# Props and one-way data flow in Vue

**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).