JamieCurnow / vue-clipboard3

Easily copy to clipboard in Vue 3
MIT License
129 stars 13 forks source link

Using props #1

Closed jeffykle closed 3 years ago

jeffykle commented 3 years ago

Great job! I'm not too familiar with typescript but I got it to work with props. (Couldn't reply to your Medium article for some reason).

<template lang="html">

  <button @click="copy" class="btn btn-link">COPY</button>

</template>

<script lang="ts">

import { defineComponent } from 'vue'

import useClipboard from 'vue-clipboard3'

export default defineComponent({

  props: {

    route: Object

  },

  setup(props) {

    const { toClipboard } = useClipboard()

    const copy = async () => {

      try {

        await toClipboard(location.host + '/#' + props.route.fullPath)

        console.log('Copied to clipboard')

      } catch (e) {

        console.error(e)

      }

    }

    return { copy }

  }

})

</script>

Then in parent component: <Copy :route="$router.resolve({ name: 'Client', params:{ userid: userId }})" />

JamieCurnow commented 3 years ago

Awesome @jeffykle ! Glad to hear it's working for you :)