这里子组件接收参数，为什么不能直接写成，接收“params”？
来源：1-4 单项数据流的理解
JennieLiu
2022-05-22 16:12:01
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="https://unpkg.com/vue@next"></script>
</head>
<body>
<div id="root"></div>
</body>
<script>
const app = Vue.createApp({
data(){
return{
params:{
a:123,
b:456,
c:789
}
}
},
template:`<div><test v-bind="params" /></div>`
});
app.component('test',{
// props:['a','b','c'],
props:['params'],
template:`<div>{{params.a}}</div>`
});
const vm = app.mount('#root');
</script>
</html>
老师，这里子组件接收参数，为什么不能直接写成，接收“params”？，一定要在子组件的props里，像这样 【props:['a','b','c'],】 把所有接收的参数，一条一条写全吗？
1回答
-
樱桃小胖子
2022-05-22
同学你好，之所以要在子组件的props中声明，是因为子组件不能直接在模板里面渲染父元素的数据。如果子组件想要引用父元素的数据，那么就在prop里面声明一个变量，这个变量可以引用父元素的数据，然后在模板里渲染这个变量，这时候渲染出来的就是父元素里面的数据。也就是说props是子组件访问父组件数据的唯一接口。子组件要接收的父元素的数据必须在props中进行声明，否则是无法接收到父元素传递的数据的。
祝学习愉快！
0
相似问题