demo: wrap a vue2 component

dlw-uploader.vue

<template>
  <div>
    <raw-upload v-bind="$attrs" v-on="$listeners" :on-preview="previewHandler">
      <slot v-for="(_, slotName) in $slots" :name="slotName" :slot="slotName" />
      <template v-for="(_, slotName) in $scopedSlots" :slot="slotName" slot-scope="scope">
        <slot :name="slotName" v-bind="scope" />
      </template>
    </raw-upload>
    <dlw-viewer v-if="enhanced" ref="viewer" />
  </div>
</template>
  
<script>
import DlwViewer from '@/components/dlw-viewer/dlw-viewer.vue'

export default {
  name: 'ElUpload',
  components: {
    DlwViewer
  },
  inheritAttrs: false,
  props: {
    enhanced: {
      type: Boolean,
      default: true
    }
  },
  methods: {
    onPreview (file) {
      const url = (file.response && file.response.url) || file.url
      this.$refs.viewer.preview(url, true)
    }
  },
  computed: {
    previewHandler () {
      return this.enhanced ? this.onPreview : this.$attrs['on-preview']
    }
  }
}
</script>