JSFiddle - React, Tailwind, and code Playground
by skirtle
HTML
<script src="https://unpkg.com/[email protected]/dist/vue.js"></script>
<div id="app">
<div class="form-group">
<img :src="inspector.image" :alt="inspector.name"/>
<input type="file" id="changeImg" @change="changeInspectorImage($event)">
<i class="las la-image float-right"
@click.submit="iClick">Click here</i>
</div>
</div>
JavaScript
new Vue({
data () {
return {
inspector: {}
}
},
methods: {
changeInspectorImage () {
inspector.image = event.target.files[0];
console.log('changing image to '+inspector.image);
},
iClick () {
document.getElementById('changeImg').click()
}
}
}).$mount('#app')