Help for to integrate flipbook-vue + Quasar Framework

[carlosarmentac]

I'm having trouble to integrate flipbook-vue + Quasar Framework, I just Started with an empty Quasar Framework Template and importing flipbook-vue with yarn. I can see the buttons but no mage. My code is:

<template>
  <q-page class="flex flex-center">
    <flipbook :pages="pages" v-slot="flipbook">
      <button @click="flipbook.flipLeft">Previous Page</button>
      <button @click="flipbook.flipRight">Next Page</button>
    </flipbook>
  </q-page>
</template>

<script>
import Flipbook from 'flipbook-vue'

export default {
  components: { Flipbook },
  name: 'PageIndex',
  data: () => {
    return {
      pages: [require('../assets/book/1.jpg').default, require('../assets/book/2.jpg').default]
    }
  }
}
</script>

<style>
.flipbook .viewport {
  width: 90vw;
  height: 90vh;
}
</style>

The result is:

No Warning or Errors in Console. Any clue? Thank you!

[ts1]

Sorry for the late reply. I think .flipbook .viewport is not working, because you are not giving class name to flipbook.