How to pass props in vue.js?

@elise_daugherty 

In Vue.js, you can pass props from a parent component to a child component by using v-bind or the shorthand symbol ":".

Here's an example of how to pass props from a parent component to a child component:

1. In the parent component's template, use v-bind or : to bind the props to the child component:

1
2
3

<template>
  <child-component :propName="propValue"></child-component>
</template>

1. In the child component, add the props option to specify which props it expects to receive:

1
2
3
4
5

<script>
export default {
  props: ['propName']
}
</script>

Now, the child component will receive the prop propValue from the parent component. You can access this prop in the child component's template or script section as needed.

Remember that props are passed down from parent to child components and are read-only, so the child component should not mutate the prop directly. If you need to modify the prop, consider using data or computed properties instead.