ts1/flipbook-vue

Is possible to add in the array a local path?

anamarquezz opened this issue · 2 comments

anamarquezz commented

For Example
'@/assets/img/pagina14.jpg'


<template>
<div class="conta">
  <flipbook class="flipbook" :pages="pages" zooms="1" >    
  </flipbook>
</div>
</template>

<script>
  // @ is an alias to /src
  //import UserNavigation
import flipbook from 'flipbook-vue'
  import {
    mapState,
    mapActions,
    mapGetters
  } from "vuex";

  export default {
    name: 'dashboard',
    components: {
       flipbook
    },
    computed: {
      ...mapState({            
      })
    },
    data() {
      return {
        pages:[
            '@/assets/img/pagina1.jpg',            
            '@/assets/img/pagina2.jpg', 
            '@/assets/img/pagina3.jpg', 
            '@/assets/img/pagina4.jpg', 
            '@/assets/img/pagina5.jpg', 
            '@/assets/img/pagina6.jpg', 
            '@/assets/img/pagina7.jpg', 
            '@/assets/img/pagina8.jpg', 
            '@/assets/img/pagina9.jpg',            
            '@/assets/img/pagina10.jpg', 
            '@/assets/img/pagina11.jpg', 
            '@/assets/img/pagina12.jpg', 
            '@/assets/img/pagina13.jpg', 
            '@/assets/img/pagina14.jpg'           
            ] 
        };
    },
    methods: {  
    }
  }
</script>
<style scoped>
  /*@import "../assets/css/global.css";*/
.flipbook {
  width: 95vw;
  height: 95vh;
}


</style>
ts1 commented 
import page1 from '@assets/img/page1.jpg'
import page2 from '@assets/img/page2.jpg'
...

pages: [
  page1,
  page2,
  ...
]

OR

pages: [
  require('@/assets/img/page1.jpg').default,
  require('@/assets/img/page2.jpg').default,
  ...

or something like that.

  • 👍1
ts1 commented

I believe this issue is resolved.
Feel free to reopen if it is not.