Невозможно прочитать свойство 'length' из неопределенного "` для v-file-input Vuetify - PullRequest
0 голосов
/ 08 января 2020

Я создаю повторно используемый компонент для v-file-input Vuetify.

Форма. vue

<BaseFile v-model="image" label="Upload Image"/>

<script>
  export default {
    name: 'Form',
    data() {
      return {
        image: []
      }
    }
  }
</script>

BaseFile. vue

<v-file-input
  :value="value"
  :label="label"
  solo
  show-size
  @change="updateValue">
</v-file-input>

<script>
 export default {
   name: 'BaseFile',
   props: {
     label: { type: String },
     value: { type: Array }
   },
   methods: {
     updateValue(file) {
       if (file.name) {
          const reader = new FileReader();
          reader.onload = e => {
            const base64Data = e.target.result;
            const uploadFile = [{ fileName: file.name, base64: base64Data }];

            this.$emit('input', uploadFile);
          }
          reader.readAsDataURL(file);
       }
     }
   }
 }
</script>

Значение изображения становится

[ 
  { fileName: 'hello.png', base64: '.....'}
]

Но я получаю

TypeError: Невозможно прочитать свойство 'length' из undefined "

1 Ответ

1 голос
/ 08 января 2020

Проблема в v-file-input, ожидается, что value prop будет "Один или массив Файл объектов." поэтому, как только вы выберете один файл, содержимое image данных (и, следовательно, value prop) станет чем-то иным, чем ожидает Vuetify ...

...