Как с помощью jspdf добавить несколько изображений в pdf файл, чтобы каждое изображение на отдельной странице?

Ниже кусочки из компонента vue:

загружаем pdf для моментального просмотра

...
<object id="pdf_viewer" type="application/pdf" :data="[pdf ? pdf : empty()]" width="100%" height="100%"></object> 
...

.
canvas - это массив с элементами canvas
хочу добавить каждое изображение на отдельную(новую) страницу в документе

generatePDF(canvas) {
            const pdf = new jsPDF('p', 'pt', 'a4')

            canvas.forEach((image, i) => {
                !!i && pdf.addPage() 
                pdf.addImage(image, 'PNG', 80, 80, image.width, image.height, `image${i}`)
            })

            // pdf.output('save', 'tasks.pdf');   
                                            
            this.pdf = pdf.output('datauristring'); // здесь походу что-то не то происходит
        },
        empty() {
            const pdf = new jsPDF();
            return pdf.output('datauristring');
        },

В атрибут data элемента object должно пойти pdf.output('datauristring')
Если в массиве canvas больше одного элемента, что-то идёт не так(pdf.output('datauristring') возвращает некорректное значение видимо, других причин быть не может), а если один, то всё норм.

Интересно, что при сохранении документа( если выполнить pdf.output('save', 'tasks.pdf');) pdf генерируется корректно.
Помогите понять, что не так

UPDATED
https://codesandbox.io/embed/5x26o14jn