VUE父子组件通信和Clipboard复制功能实现

本文主要是介绍VUE父子组件通信和Clipboard复制功能实现，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

                                                      VUE父子组件通信和Clipboard复制功能实现

一、VUE父子组件通信

引入组件转标签命名规则是驼峰转横线

父组件

 handleDelete方法写法：这里展示是一个删除功能

子组件

父子组件通信情况从上面两张图已经可以明确表示了，说明如下：

1、父组件传值给子组件

在子组件里面编写

props: [] 可以是对象也可以数组

props: {

    userId: String,

    default: ''

}

父组件里面子组件标签前半部分编写：

：userId="xxx"

2、子组件传值给父组件

子组件里面编写：

this.$emit('delete', xxx)

父组件里面子组件标签前半部分编写：

@delete="handledelete"方法

二、Clipboard复制功能

1、安装Cliboard组件并import引入

（1）安装命令如下

npm install clipboard --save

（2）引入

import Clipboard from 'clipboard'

comments: {

    Clipboard

}

2、hmtl如下：

3、js如下

至此ok

这篇关于VUE父子组件通信和Clipboard复制功能实现的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---