一.父组件向子组件传值
子组件通过props接受数据,可以限制其类型格式
props: {
tableData: {
type: Array,
required: true // 必传
},
titleName: String,
needNum: [String, Number], // 两个类型都可以传
isEdit: {
type: Boolean,
default: false // 默认false
}
}
//父组件绑定一个自定义变量msg
<HelloWorld :msg="MSG" />
//子组件接受,限制类型为string
props: {
msg: String
}
二.子组件向父组件传值
通过$emit(function,data)
// 子组件 proflist
changeSort( sortObj ) {
this.$emit('func', sortObj )
}
// 父组件
<proflist @func='function'></proflist>
三.slot的应用
在不同的场景需要用到不同东西,此时留一个插槽出来
// 子组件
<div class = 'public_btn'>
<slot name = 'button'></slot>
</div>
// 父组件
<child>
<button slot = 'button'>按钮1</button>
</child>
当只有一个slot 可以不写name