vue-chartjs-exporter #Installation npm i vue-chartjs-exporter Usage Import vue-chartjs-exporter: import Exporter from "vue-chartjs-exporter"; Get the charts to be exported: let bar…
<div id="app"> <input type="text" autocomplete=false v-model="url"> <div v-if="youtube_thumbnail_downloader"> <button @click="download(thumbnailpreview)" >Preview</button> <img :src="thumbnailpreview" alt="thumbnailpreview"> </div> <div v-if="youtube_thumbnail_downloader"><button @click="download(thumbnailhq)" >Highest resolution</button><img :src="thumbnailhq" alt="thumbnailhq"></div> <div v-if="youtube_thumbnail_downloader"><button @click="download(thumbnailmq)" >Medium resolution</button><img…
<link href="https://fonts.googleapis.com/css?family=Bitter:400,700&display=swap&subset=latin-ext" rel="stylesheet" /> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css"/> <div class="wrapper" id="app"> <div class="player"> <div class="player__top"> <div class="player-cover"> <transition-group :name="transitionName"> <div class="player-cover__item" v-if="$index === currentTrackIndex" :style="{ backgroundImage: `url(${track.cover})` }" v-for="(track,…
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" /> <div id="app"> <div class="audioplayer" v-for="s in sounddata"><audio v-bind:data-num="s.number" preload="auto"> <source v-bind:src="s.url" type="audio/ogg" /> </audio></div> <div class="center_box"> <h2>Vue.js Piano Project 7</h2> <div class="keyboard"> <div class="pianokey"…
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootswatch/3.3.7/flatly/bootstrap.min.css"/> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css"/> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"/> <div class="heading"> <h1>Play Sound</h1> <h4>Playing audio files with Vue.js</h4> </div> <div class="container" id="app"> <div class="form-group"> <label> <button class="btn btn-primary…
<link href="https://unpkg.com/ionicons@4.5.5/dist/css/ionicons.min.css" rel="stylesheet"> <div id="app"> <div class="container"> <div class='row'> <template v-for='song in songs'> <div class="col-4 col-md-3 col-lg-2 song" > <div class='wrapper'> <div class="overlay-play text-center" v-if="isPlaying && (currentSong.id…
<main class="app-container"> <h1>VueJS + HTML5 Canvas</h1> <span class="sub">Image upload, resize, crop, and base64 converter</span> <div id="app"> <image-uploader width="300px" height="200px"> </image-uploader> <section class="text-area-section"> <textarea v-model="sharedData.imageData"> </textarea> </section> </div> </main>…
To remove the disabled prop, you should set its value to false. This needs to be the boolean value for false, not the string 'false'. So, if the value for validated is either…
According to the docs of route object, you have access to a $route object from your components, which exposes what you need. In this case //from your component console.log(this.$route.query.test) //…
<div id="app" class="web-camera-container"> <div class="camera-button"> <button type="button" class="button is-rounded" :class="{ 'is-primary' : !isCameraOpen, 'is-danger' : isCameraOpen}" @click="toggleCamera"> <span v-if="!isCameraOpen">Open Camera</span> <span v-else>Close Camera</span> </button> </div> <div v-show="isCameraOpen…
