在我们编写前端代码时,经常遇到的一种场景,子组件需要使用父组件的值,这种情况下,我们可以使用props帮助我们进行父子组件间的通信。这里我们先模拟一个场景,展示如何使用。
场景:在父组件修改值,传递给子组件,子组件进行显示,如下图所示。
实现:
(1)子组件定义与使用;
1、定义子组件subOneComponent.vue,在props中定义父组件传递的值;
props: {
inputValue: {
type: String, // 变量类型
default: function () { // 默认返回值,可以在此处对传过来的值进行操作
return ""
}
}
},
2、在子组件中展示
<el-input type=