vue组件间传参

1、父组件向子组件传参

　　父组件：

　　　　objVal: {name: 'aa', age: 18}

　　　　

　　子组件：

　　　　第一种接收方法

　　　　props: ['title', 'obj']

　　　　第二种接收方法

　　　　props: {

　　　　　　title: String,　　// 简写

　　　　　　title:{　　　　// 具体写法

　　　　　　　　type: String,

　　　　　　　　default: '标题'

　　　　　　},

　　　　　　obj: {

　　　　　　　　name: String,

　　　　　　　　age: Number

　　　　　　}

　　　　}

 

2、子组件向父组件传参

　　子组件：

　　　　删除

　　　　del( ){

　　　　　　this.$emit('btn', '删除数据')

　　　　}

　　父组件：

　　　　

　　　　receive(data){

　　　　　　console.log(data)　　// '删除数据'

　　　　}

 

 

　　子组件：

　　　　删除

　　　　props: ["delData"]

　　　　del( ){

　　　　　　this.$emit('btn', this.delData)

　　　　}

　　父组件：

　　　　

　　　　receive(data){

　　　　　　data( )

　　　　}

 

3、父组件使用子组件的数据或方法

　　子组件：

　　　　子组件

　　　　msg:  '子组件数据'

　　　　fun( ){console.log('子组件方法')}

　　父组件：

　　　　父组件

　　　　

　　　　this.$refs.btn.msg　　// '子组件数据'

　　　　this.$refs.btn.fun( )　　// '子组件方法'

　　　　this.$refs.pp.style.color="red"