element-ui组件二次封装

下面以e-input为例 封装组件主要解决三个方面的问题

• 1、属性传值 采用$attrs
• 2、事件传递采用 $listeners
• 3、ref使用

    <div>
      <el-input ref='inp' v-bind="$attrs" v-on="$listeners"  placeholder="请输入内容">
        <template v-for="(value,name) in $slots" #[name]='slotData'>
          <slot :name="name" v-bind="slotData || {}"></slot>
        </template>
      </el-input>
    </div>
  </template>
  <script>
  export default {
    name:'euiInput',
    mounted(){
        const entries= Object.entries(this.$refs.inp)
        for (const [key,value] of entries) {
           if(typeof(value)==='function'){
            this[key]=value;
          }
        }
    }
  }
  </script>