<template> <div id="pricing"> <div class="loading" v-if="!products.length"> <span>Loading ...</span> </div> <Product v-else v-for="product in products" v-bind:key="product.uuid" :product="product" /> </div> </template> <script> import Product from 'vuejs/components/Content/Product' import { mapState, mapActions } from 'vuex' export default { name: "Pricing", // data() { // return { // items:[], // page:0 // } // }, computed: { ...mapState({ products: state => state.Pages.products }) }, created(){ if(!this.products.length) this.getProducts() }, methods: { ...mapActions({ getProducts: 'Pages/getProducts' }) }, components: { Product } } </script> <style lang="scss" scoped> </style>