vuejs
update file feature without dependecies with vue
<v-card flat>
<v-card-title>Meta Tags</v-card-title>
<v-card-subtitle class="mt-5 mb-n2">Social image</v-card-subtitle>
<v-responsive>
<v-img : src="previewImage" class="uploading-image d-block" />
</v-responsive>
<input
type="file"
id="myFile"
name="myFile"
accept="image/*"
@change="uploadImage"
class="input-file"
/>
<div class="d-flex justify-center mt-2 mb-3">
<v-btn small outlined color="indigo darken-3">
<label for="myFile">Upload your Image</label>
<v-icon small right color="indigo darken-3">mdi-upload</v-icon>
</v-btn>
</div>
</v-card>
<script>
uploadImage(e) {
const image = e.target.files[0];
const reader = new FileReader();
reader.readAsDataURL(image);
reader.onload = e => {
this.previewImage = e.target.result;
this.fbImg = this.previewImage;
this.twitterImg = this.previewImage;
console.log(this.previewImage);
};
},
</script>
Was this helpful?
Similar Posts