uniapp 动态父组件向子组件传值
时间: 2023-09-04 22:10:49 浏览: 108
父组件中vuex方法更新state子组件不能及时更新并渲染的完美解决方法
在uni-app中,父组件向子组件传递值可以通过props属性实现。具体步骤如下:
1. 在父组件中,定义一个数据变量并赋值,例如:
```
<template>
<div>
<child :msg="parentMsg"></child>
</div>
</template>
<script>
export default {
data() {
return {
parentMsg: '这是来自父组件的消息'
}
}
}
</script>
```
2. 在子组件中,通过props属性接收父组件传递的值,例如:
```
<template>
<div>{{ msg }}</div>
</template>
<script>
export default {
props: {
msg: {
type: String,
default: ''
}
}
}
</script>
```
父组件通过`<child :msg="parentMsg"></child>`语法将parentMsg传递给子组件的msg属性,子组件中通过props属性接收msg属性并显示在页面上。
需要注意的是,父组件传递的值需要在子组件的props属性中定义接收的类型和默认值。
阅读全文