<div id="app" v-cloak>
  <p>
  <label for="appId">App ID: </label>
  <input id="appId" v-model="appId">
  <button v-if="canCopy" @click="copy(appId)">Copy</button>
  </p>
  
  <p>
  <label for="appToken">App Token: </label>
  <input id="appToken" v-model="appToken">
  <button v-if="canCopy" @click="copy(appToken)">Copy</button>
  </p>  
</div>

[v-cloak] {display: none}

label {
  display:inline-block;
  width:100px;
}

input {
  width:200px;
}

Vue.config.productionTip = false;
Vue.config.devtools = false;

const app = new Vue({
  el:'#app',
  data: {
    appId:'3493993048904',
    appToken:'dksklq33lkj21kjl12lkdsasd21jk',
    canCopy:false
  },
  created() {
    this.canCopy = !!navigator.clipboard;
  },
  methods: {
    async copy(s) {
      await navigator.clipboard.writeText(s);
      alert('Copied!');
    }
  }
})