// App.vue
<template>
  <MyBtn 
    class="malza"
    style="color: royalblue"
    color="#ff0000"
    @printlog="log">
    Apple
  </MyBtn>
</template>

<script>
import MyBtn from "~/components/MyBtn"

export default {
  components: {
    MyBtn
  },
  methods: {
    log() {
      console.log('Hello vue!')
    }
  }
}
</script>

// MyBtn.vue
<template>
  <div
    v-bind="$attrs"
    class="btn"
    @click="printlog">
    <slot></slot>
  </div>
</template>

<script>
import { onMounted } from 'vue'
export default {
  inheritAttrs: false,
  props: {
    color:{
      type: String,
      default: 'gray'
    }
  },
  emits: ['printlog'],
  setup(props, context) {
    function printlog() {
      context.emit('printlog')
    }
    onMounted(() => {
      console.log(props.color)
      console.log(context.attrs)
    })

    return {
      printlog
    }
  }
}
</script>