Update deferred demo
parent
02c98a0526
commit
2d6703e45b
|
@ -1,6 +1,6 @@
|
|||
import axios from 'axios'
|
||||
|
||||
export default class CarService {
|
||||
export default class CustomerService {
|
||||
|
||||
getCustomersSmall() {
|
||||
return axios.get('demo/data/customers-small.json').then(res => res.data.data);
|
||||
|
|
|
@ -119,7 +119,6 @@ export default {
|
|||
sales: null
|
||||
}
|
||||
},
|
||||
carService: null,
|
||||
created() {
|
||||
this.sales = [
|
||||
{product: 'Bamboo Watch', lastYearSale: 51, thisYearSale: 40, lastYearProfit: 54406, thisYearProfit: 43342},
|
||||
|
@ -172,7 +171,6 @@ export default {
|
|||
sales: null
|
||||
}
|
||||
},
|
||||
carService: null,
|
||||
created() {
|
||||
this.sales = [
|
||||
{product: 'Bamboo Watch', lastYearSale: 51, thisYearSale: 40, lastYearProfit: 54406, thisYearProfit: 43342},
|
||||
|
|
|
@ -21,11 +21,11 @@
|
|||
</div>
|
||||
|
||||
<DeferredContent @load="onDataLoad">
|
||||
<DataTable :value="cars">
|
||||
<Column field="vin" header="Vin"></Column>
|
||||
<Column field="year" header="Year"></Column>
|
||||
<Column field="brand" header="Brand"></Column>
|
||||
<Column field="color" header="Color"></Column>
|
||||
<DataTable :value="products">
|
||||
<Column field="code" header="Code"></Column>
|
||||
<Column field="name" header="Name"></Column>
|
||||
<Column field="category" header="Category"></Column>
|
||||
<Column field="quantity" header="Quantity"></Column>
|
||||
</DataTable>
|
||||
</DeferredContent>
|
||||
</div>
|
||||
|
@ -34,26 +34,27 @@
|
|||
<DeferredContentDoc />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import CarService from '../../service/CarService';
|
||||
import ProductService from '../../service/ProductService';
|
||||
import DeferredContentDoc from './DeferredContentDoc';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
cars: null
|
||||
products: null
|
||||
}
|
||||
},
|
||||
carService: null,
|
||||
productService: null,
|
||||
created() {
|
||||
this.carService = new CarService();
|
||||
this.productService = new ProductService();
|
||||
},
|
||||
methods: {
|
||||
onImageLoad() {
|
||||
this.$toast.add({severity: 'success', summary: 'Image Initialized', detail: 'Scroll down to load the datatable'});
|
||||
},
|
||||
onDataLoad() {
|
||||
this.carService.getCarsSmall().then(data => this.cars = data);
|
||||
this.productService.getProductsSmall().then(data => this.products = data);
|
||||
this.$toast.add({severity: 'success', summary: 'Data Initialized', detail: 'Render Completed'});
|
||||
}
|
||||
},
|
||||
|
|
|
@ -85,35 +85,35 @@ import DeferredContent from 'primevue/deferredcontent';
|
|||
</div>
|
||||
|
||||
<DeferredContent @load="onDataLoad">
|
||||
<DataTable :value="cars">
|
||||
<Column field="vin" header="Vin"></Column>
|
||||
<Column field="year" header="Year"></Column>
|
||||
<Column field="brand" header="Brand"></Column>
|
||||
<Column field="color" header="Color"></Column>
|
||||
<DataTable :value="products">
|
||||
<Column field="code" header="Code"></Column>
|
||||
<Column field="name" header="Name"></Column>
|
||||
<Column field="category" header="Category"></Column>
|
||||
<Column field="quantity" header="Quantity"></Column>
|
||||
</DataTable>
|
||||
</DeferredContent>
|
||||
</template>
|
||||
</CodeHighlight>
|
||||
|
||||
<CodeHighlight lang="javascript">
|
||||
import CarService from '../../service/CarService';
|
||||
import ProductService from '../../service/ProductService';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
cars: null
|
||||
products: null
|
||||
}
|
||||
},
|
||||
carService: null,
|
||||
productService: null,
|
||||
created() {
|
||||
this.carService = new CarService();
|
||||
this.productService = new ProductService();
|
||||
},
|
||||
methods: {
|
||||
onImageLoad() {
|
||||
this.$toast.add({severity: 'success', summary: 'Image Initialized', detail: 'Scroll down to load the datatable'});
|
||||
},
|
||||
onDataLoad() {
|
||||
this.carService.getCarsSmall().then(data => this.cars = data);
|
||||
this.productService.getProductsSmall().then(data => this.products = data);
|
||||
this.$toast.add({severity: 'success', summary: 'Data Initialized', detail: 'Render Completed'});
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue