setup函数的参数
它主要有两个参数:
- 第一个参数:props :父组件传递过来的属性会被放到props对象中
- 第二个参数:context:包含3个属性
- attrs:所有的非prop的attribute
- slots:父组件传递过来的插槽(这个在以渲染函数返回时会有作用,后面会讲到)
- emit:当我们组件内部需要发出事件时会用到emit
一、父组件要给子组件传值时,可以通过props来完成组件的通信
// 父组件
<template>
// 通过自定义属性的方式给子组件传递数据
<message title="父组件中的值"></message>
</template>
// 子组件
<template>
// 使用父组件传递过来的值
<h2> {
{title}} </h2>
</template>
<script>
export default {
// 通过props 接收父组件传递过来的数据,模板中可以直接使用
props: ['title'],
setup(props, context) {
// setup函数中要使用的话,要接收一下
console.log(props.title)
}
</script>
子组件中props两种常见的用法<