Блог

Я не хочу отображать имя нескольких файлов в своем шаблоне, я это делаю:

 lt;div v-for="(image, index) in imagesReturn" :key="index"gt;  lt;spangt;{{ image.name }}lt;/spangt;  lt;/divgt;  lt;divgt;  lt;generic-input  v-model="imagesReturn"  type="file"  multiple  @change="addFiles"  gt;  add files  lt;/generic-inputgt;  lt;/divgt;  lt;scriptgt; data() { return{  imagesReturn: [];  } } methods: {  addFiles(e) {  let selectedFiles = e.target.files;  for (let img of selectedFiles) {  this.imagesReturn.push(img.name);  }  } } lt;/scriptgt;  

Я хочу отобразить имя файлов в массиве imagesReturn, но у меня возникает ошибка, когда я нажимаю внутри массива ошибка this.imagesReturn.push не является функцией, я не знаю, почему, и я не могу отобразить имя файлов в своем шаблоне. Пожалуйста, спасибо вам.

Часть js кажется мне прекрасной. Я предполагаю, что проблема кроется в generic-input компоненте.

Как правило, когда something.push is not a function произошла ошибка, это всегда означает something , что это не массив.

Поскольку imagesReturn используется двусторонняя привязка v-model , возможно, что generic-input компонент изменяется imagesReturn с [] на '' (пустая строка) или null после монтирования.

Поэтому я предлагаю вам console.log(this.imagesReturn) зайти внутрь addFiles() , чтобы посмотреть, когда изменится значение (или watch imagesReturn ).

Я не знаю generic-input , принадлежит ли компонент к структуре пользовательского интерфейса или создан вами самими. Если вы принадлежите к структуре пользовательского интерфейса, вам необходимо внимательно прочитать документацию о @change="function(params)" событии, особенно его параметры. Если он написан самостоятельно, вам нужно проверить, какое значение он передаст в компоненте, когда emit('change', value) .