项目中遇到一个需求，需要根据后台返回数据，遍历生成多个按钮，并点击出发事件。点击事件的时候需要该按钮loading状态。实现方法如下：

<div class="center">
         <a-button v-for="(item,index) in btnItems" type="primary" :key="index" :loading="clickIndex === index && changeLoading"  @click="exportForm(item.id)">{{item.text}}</a-button>
 data () {
      return {
        clickIndex:-1,
        changeLoading:false
exportForm(tempateId,index,item){
          this.clickIndex=index
          this.changLoading=true
            // 处理结束后重新赋值
          this.clickIndex=-1
          this.changLoading=false
在平时的工作中，经常会遇到一个场景：
点击按钮时请求一些接口数据，而为了避免用户重复的点击我们通常会为这些按钮添加loading。这个添加loading的功能本身时非常简单的，只要我们定义一个变量使用在Button组件中即可，但在做后台管理类项目时，这样的按钮可能会有非常非常多，可能一个组件中，很多变量都是xxx_loading，耗时耗力又不够优雅。
接下来，我们对Button组件做一个简单的封装来解决这个耗时耗力又不够优雅的loading问题
我们在使用Antd的Modal对话框时
1： a-button: 按钮组： 按钮样式： 按钮有五种样式：
   主按钮样式： type="primary"  次按钮样式： type="default"  虚线按钮： type="dash"  警告按钮： type= "danger"  连接按钮： type="link";
    <a-button type="primary">
      Primary
    </a-button...
                                    api：Ant Design of React
按钮有四种类型：主按钮（primary）、次按钮（default）、虚线按钮（dashed）、危险按钮（danger）
通过配置type属性即可：
图标按钮：
当需要在Button内嵌入Icon时，可以设置icon属性，或者直接在Button内使用Icon组件。如果想控制Icon具体的位置，只能直接使用Icon组件，而非icon属性。
                                    目录一、在v-for循环中加入ref=“名称”二、在生命周期updated里将this.$refs.名称[0]（代表循环中第一个元素）赋值给变量三、在watch监听中，监听该变量直接".click()"即可实现页面加载调用v-for循环的第一个点击事件