vue父子传值和传方法

父组件给子组件传值

父组件代码
vue父子传值和传方法
子组件代码
vue父子传值和传方法
效果图
vue父子传值和传方法
传多个值
vue父子传值和传方法

vue父子传值和传方法
效果图
vue父子传值和传方法

父组件给子组件传方法

父组件代码
vue父子传值和传方法
子组件接收方法代码
vue父子传值和传方法
效果
vue父子传值和传方法

更厉害的把整个父组件传给子组件

父组件代码
vue父子传值和传方法
子组件代码
vue父子传值和传方法
效果vue父子传值和传方法
下面是获取方法
vue父子传值和传方法
效果
vue父子传值和传方法

父组件获取子组件值

这是子组件代码
vue父子传值和传方法
这是父组件代码
vue父子传值和传方法
效果
vue父子传值和传方法

使用ref方法 来获取子组件的数据和方法

1:获取子组件的数据
父组件代码

vue父子传值和传方法
子组件代码
vue父子传值和传方法

效果
vue父子传值和传方法
2:获取子组件的方法
父组件代码
vue父子传值和传方法

子组件代码
vue父子传值和传方法
效果
vue父子传值和传方法

(第二种)子组件使用$parent获取父组件的数据和方法

获取父组件数据
父组件代码
vue父子传值和传方法
子组件代码
vue父子传值和传方法

效果
vue父子传值和传方法
获取父组件方法
父组件代码
vue父子传值和传方法
子组件代码
vue父子传值和传方法

效果
vue父子传值和传方法

好了 好了 到这就差不多了,腰酸背痛呐