# Vue學習#24 用 v-model 將 props 傳入值進行雙向綁定
###### tags: `Vue 直播班 - 2022 春季班`

## props
props 之前的使用於可以將父元件的資料傳給子元件資料，但僅限於渲染畫面並不能直接透過子元件來進行修改 (單向數據流)

## 那如果真的想修改哩?
這時候就需要加上 emit 來做
語法如下:
`$emit('update:props名稱',$event.target.value)`
就可以透過 v-model 同時修改父子元件的 data

## 使用方式

### 綁定 props 前要加上 v-model

如果想要修改資料，使用 props 綁定前要多加上一個 v-model

### 將 props 綁定值放到標籤上

將 props 綁定在標籤上

### 使用 emit

使用這行語法 `$emit('update:props名稱',$event.target.value)`

`update:` 為固定用法， `$event.target.value` 為代表 input 目前所輸入的值


### 完成!

## [範例](https://codepen.io/binlandz123/pen/abEejWY?editors=1010)