首页 > 其他 > 详细

如何封装一个组件

时间:2019-05-24 17:39:33      阅读:432      评论:0      收藏:0      [点我收藏+]

封装组件要向外面冒出方法,以供调用

例如 tabs组件

//change 暴露出方法来
<template>
  <div class="iip-base-tab">
      <el-radio-group v-model="currentOption" @change="handlerChange" size="default" border="false">
        <el-radio-button v-for="(item,index) in options" :key="index" :label="item.value"> {{item.text}} </el-radio-button>
      </el-radio-group>
    </div>
</template>

//暴露给父组件
 handlerChange (value) {
      this.$emit(‘change‘, value)
    }

父组件触发自定义事件change

<base-tab :options="options" @change="handleChangeTabs"></base-tab>
//在这里传参数获取数据   
 handleChangeTabs (tab) {
      let currentStatus = tab
      let params = {
        ‘start‘: this.page.number + ‘‘,
        ‘size‘: this.page.size + ‘‘,
        ‘status‘: currentStatus
      }
      this.loadData(params)
    },

 

如何封装一个组件

原文:https://www.cnblogs.com/joer717/p/10919194.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!