SpecialistOff.NET / Вопросы / Статьи / Фрагменты кода / Резюме / Метки / Помощь / Файлы
Список вопросов ПечатьМетки: vue.js javascript
RemiZOffAlex Создано: 2018-04-05 23:36:06.385116 Обновлено: 2018-04-05 23:36:06.385116 |
---|
<section id="app"> <form method="post" action="/image/add" enctype="multipart/form-data"> <div class="form-group"> <input type='file' multiple @change="previewImages" id="newfiles" name="newfiles[]" class="form-control" accept="image/*" /> </div> <div class="row"> <div class="col py-2"> <button class="btn btn-outline-success float-right">Загрузить</button> </div> </div> </form> <div class="row"> <div class="col-md-6 py-2 border" v-for="(image, index) in imagesData"> <img class="img-thumbnail" :src="image" v-if="image.length > 0"> </div> </div> </section> Скрипт <script> new Vue({ el: '#app', data: { imagesData: [] }, methods: { previewImages: function(event) { this.imagesData = []; var pictures = event.target.files; for (var i = 0; i < pictures.length; i++) { var reader = new FileReader(); reader.onload = (e) => { this.imagesData.push(e.target.result); } reader.readAsDataURL(pictures[i]); } } } }); </script> |