组件开发中难免会遇到子组件父组件之间以及兄弟组件之间的传值问题。
1、父组件传值给子组件:
如果父组件需要将placeholder值传给子组件,则在父组件标签中定义:placeholder="XXX",子组件在data中定义props:['placeholder']来接受,这样接收过来的placeholder就可以直接用this.label取出使用。
注意:props属性只可以取出使用,并不能改变其值。
父组件中:
<inputText :placeholder="control.placeholder"></inputText>
子组件中:
<input type="text" v-model="modelValue" :placeholder="placeholder">
export default {
data() {
return {
modelValue:'',
}
},
props:['placeholder'],
}
2、子组件传值给父组件:
如果子组件需要将input输入框的值传给父组件