# KClipboard

<KClipboardProvider /> Provide clipboard functionality to components.

<template>
<KInput
  :value="dataToCopy"
  @input="dataToCopy = $event.target.value"
  type="text"
  class="mb-2 w-100"
/>
<KClipboardProvider v-slot="{ copyToClipboard }">
  <KButton
    @click="() => { if(copyToClipboard(dataToCopy)){ alert(`copied to the clipboard: '${dataToCopy}'`) } }">
    copy to clipboard
  </KButton>
</KClipboardProvider>
</template>

<script>
export default {
  data () {
    return {
      dataToCopy1: 'copy this to the clipboard'
    }
  },
  methods: {
    alert(msg) {
      window.alert(msg)
    }
  }
}
</script>

# Props

NOTE

This component does not have props. Check out the slots.

# Slots

  • default - content to toggle.

# Slot Props

Props Type Description
copyToClipboard Function copy to clipboard @returns {Boolean}