materio-d9/web/themes/custom/materiotheme/vuejs/components/Pages/Blabla.vue

54 lines
1.0 KiB
Vue
Raw Normal View History

<template>
<div id="blabla">
<div class="loading" v-if="!items.length">
2021-06-01 22:46:15 +02:00
<span>{{ $t('default.Loading…') }}</span>
</div>
<div class="cards-list" v-else>
<ul>
<li v-for="item in items" v-bind:key="item.nid">
<ArticleCard :item="item"/>
</li>
</ul>
<infinite-loading @infinite="nextPage">
<div slot="no-more">No more articles</div>
</infinite-loading>
</div>
</div>
</template>
<script>
import ArticleCard from 'vuejs/components/Content/ArticleCard'
import { mapState, mapActions } from 'vuex'
export default {
name: "Blabla",
// data() {
// return {
// items:[],
// page:0
// }
// },
computed: {
...mapState({
items: state => state.Blabla.items
})
},
created(){
if(!this.items.length)
this.getItems()
},
methods: {
...mapActions({
getItems: 'Blabla/getItems',
nextPage: 'Blabla/nextPage'
})
},
components: {
ArticleCard
}
}
</script>
<style lang="scss" scoped>
</style>