Vue JS - Обновить значение данных при обработке zip файла - PullRequest
Новая
       70

Vue JS - Обновить значение данных при обработке zip файла

1 голос
/ 27 мая 2020

Мне кажется, что здесь что-то не хватает с реактивностью Vue JS.

Моя проблема в том, что некоторые значения данных не обновляются, пока я распаковываю файл с помощью файловой системы и Adm-Zip.

Вот какой-то псевдокод, чтобы показать мою проблему. 

export default {
    data () {
        return {
            unzipped: 0,
            total: 0
        }
    },
    methods: {
        unzipFile (fileName) {
            var that = this

            let r = fs.createReadStream(fileName)
            let w = fs.createWriteStream('archive.zip')

            let i = 0

            r.pipe(w).on('close', function () {

                    var zip = new AdmZip('archive.zip')
                    var zipEntries = zip.getEntries()

                    that.total = zipEntries.length // not updating

                    zipEntries.forEach(function (zipEntry) {
                        zip.extractEntryTo(zipEntry.entryName, dir + 'video', false, true)
                        i++
                        that.unzipped = i // not updating
                    })

            })
            // updates are made here
        }
    }
}

that.total и that.unzipped не обновляются, пока выполняется код.

Вот код шаблона где я показываю прогресс. 

<template>
    <div>
        {{ unzipped }}/{{ total }}
    </div>
</template>

Любая помощь приветствуется.

Редактировать Вот проверенный метод, при котором свойства данных успешно обновляются. 

testUpdate () {
    var that = this
    that.total = 100
    setInterval(() => {
        that.unzipped++
    }, 1000)
}
...