diff --git a/package.json b/package.json index 005330bcc..e0855c843 100644 --- a/package.json +++ b/package.json @@ -38,7 +38,6 @@ "@vue/compiler-sfc": "3.1.5", "@vuelidate/core": "^2.0.0-alpha.14", "@vuelidate/validators": "^2.0.0-alpha.12", - "axios": "^0.19.0", "babel-eslint": "^10.1.0", "chart.js": "3.3.2", "codesandbox": "2.1.14", diff --git a/src/service/CountryService.js b/src/service/CountryService.js index 3af2ed859..890f90689 100755 --- a/src/service/CountryService.js +++ b/src/service/CountryService.js @@ -1,8 +1,7 @@ -import axios from 'axios' - export default class CountryService { getCountries() { - return axios.get('demo/data/countries.json').then(res => res.data.data); + return fetch('demo/data/countries.json').then(res => res.json()) + .then(d => d.data); } -} \ No newline at end of file +} diff --git a/src/service/CustomerService.js b/src/service/CustomerService.js index 2498173fa..0ed3c5955 100755 --- a/src/service/CustomerService.js +++ b/src/service/CustomerService.js @@ -1,24 +1,27 @@ -import axios from 'axios' - export default class CustomerService { - getCustomersSmall() { - return axios.get('demo/data/customers-small.json').then(res => res.data.data); - } + getCustomersSmall() { + return fetch('demo/data/customers-small.json').then(res => res.json()) + .then(d => d.data); + } - getCustomersMedium() { - return axios.get('demo/data/customers-medium.json').then(res => res.data.data); - } + getCustomersMedium() { + return fetch('demo/data/customers-medium.json').then(res => res.json()) + .then(d => d.data); + } - getCustomersLarge() { - return axios.get('demo/data/customers-large.json').then(res => res.data.data); - } + getCustomersLarge() { + return fetch('demo/data/customers-large.json').then(res => res.json()) + .then(d => d.data); + } - getCustomersXLarge() { - return axios.get('demo/data/customers-xlarge.json').then(res => res.data.data); - } - - getCustomers(params) { - return axios.get('https://www.primefaces.org/data/customers', { params }).then(res => res.data) - } -} \ No newline at end of file + getCustomersXLarge() { + return fetch('demo/data/customers-xlarge.json').then(res => res.json()) + .then(d => d.data); + } + + getCustomers(params) { + const queryParams = Object.keys(params).map(k => encodeURIComponent(k) + '=' + encodeURIComponent(params[k])).join('&'); + return fetch('https://www.primefaces.org/data/customers?' + queryParams).then(res => res.json()) + } +} diff --git a/src/service/EventService.js b/src/service/EventService.js index 82014150f..fc794bb36 100755 --- a/src/service/EventService.js +++ b/src/service/EventService.js @@ -1,8 +1,7 @@ -import axios from 'axios'; - export default class EventService { getEvents() { - return axios.get('demo/data/events.json').then(res => res.data.data); + return fetch('demo/data/events.json').then(res => res.json()) + .then(d => d.data); } -} \ No newline at end of file +} diff --git a/src/service/NodeService.js b/src/service/NodeService.js index 61df193fb..1b1b1a0e4 100755 --- a/src/service/NodeService.js +++ b/src/service/NodeService.js @@ -1,15 +1,12 @@ -import axios from 'axios'; - export default class NodeService { getTreeTableNodes() { - return axios.get('demo/data/treetablenodes.json') - .then(res => res.data.root); + return fetch('demo/data/treetablenodes.json').then(res => res.json()) + .then(d => d.root); } getTreeNodes() { - return axios.get('demo/data/treenodes.json') - .then(res => res.data.root); + return fetch('demo/data/treenodes.json').then(res => res.json()) + .then(d => d.root); } - -} \ No newline at end of file +} diff --git a/src/service/PhotoService.js b/src/service/PhotoService.js index 1efbcc9a9..e13d9cda8 100755 --- a/src/service/PhotoService.js +++ b/src/service/PhotoService.js @@ -1,9 +1,7 @@ -import axios from 'axios' - export default class PhotoService { getImages() { - return axios.get('demo/data/photos.json') - .then(res => res.data.data); + return fetch('demo/data/photos.json').then(res => res.json()) + .then(d => d.data); } } diff --git a/src/service/ProductService.js b/src/service/ProductService.js index 2499b2f32..55055bcc1 100644 --- a/src/service/ProductService.js +++ b/src/service/ProductService.js @@ -1,16 +1,14 @@ -import axios from 'axios'; - export default class ProductService { getProductsSmall() { - return axios.get('demo/data/products-small.json').then(res => res.data.data); + return fetch('demo/data/products-small.json').then(res => res.json()).then(d => d.data); } getProducts() { - return axios.get('demo/data/products.json').then(res => res.data.data); + return fetch('demo/data/products.json').then(res => res.json()).then(d => d.data); } getProductsWithOrdersSmall() { - return axios.get('demo/data/products-orders-small.json').then(res => res.data.data); + return fetch('demo/data/products-orders-small.json').then(res => res.json()).then(d => d.data); } } diff --git a/src/views/datatable/DataTableDoc.vue b/src/views/datatable/DataTableDoc.vue index e64131b9f..a460d98de 100755 --- a/src/views/datatable/DataTableDoc.vue +++ b/src/views/datatable/DataTableDoc.vue @@ -11,23 +11,21 @@ import ColumnGroup from 'primevue/columngroup'; //optional for column groupi
Getting Started

DataTable requires a value as an array of objects and columns defined with Column component. Throughout the samples, a car interface having vin, brand, year and color properties is used to define an object to be displayed by the datatable. - Cars are loaded by a CarService that connects to a server to fetch the cars with a axios. Note that this is only for demo purposes, DataTable does not have any restrictions on how the data is provided.

+ Cars are loaded by a CarService that connects to a server to fetch the cars with a fetch API. Note that this is only for demo purposes, DataTable does not have any restrictions on how the data is provided.


-import axios from 'axios'
-
 export default class CarService {
 
 	getCarsSmall() {
-		return axios.get('demo/data/cars-small.json').then(res => res.data.data);
+		return fetch.get('demo/data/cars-small.json').then(res => res.json()).then(d => d.data);
 	}
 
 	getCarsMedium() {
-		return axios.get('demo/data/cars-medium.json').then(res => res.data.data);
+		return fetch.get('demo/data/cars-medium.json').then(res => res.json()).then(d => d.data);
 	}
 
 	getCarsLarge() {
-		return axios.get('demo/data/cars-large.json').then(res => res.data.data);
+		return fetch.get('demo/data/cars-large.json').then(res => res.json()).then(d => d.data);
 	}
 }
 
diff --git a/src/views/galleria/GalleriaDoc.vue b/src/views/galleria/GalleriaDoc.vue
index 5e5754eb2..82aaad0e6 100755
--- a/src/views/galleria/GalleriaDoc.vue
+++ b/src/views/galleria/GalleriaDoc.vue
@@ -121,12 +121,11 @@ import Galleria from 'primevue/galleria';
 
 
 

-import axios from 'axios'
-
 export default class PhotoService {
 
 	getImages() {
-        return axios.get('demo/data/photos.json').then(res => res.data.data);
+        return fetch('demo/data/photos.json').then(res => res.json())
+                .then(d => d.data);
     }
 }
 
diff --git a/src/views/icons/Icons.vue b/src/views/icons/Icons.vue
index 4062c3e67..59d61e5f7 100755
--- a/src/views/icons/Icons.vue
+++ b/src/views/icons/Icons.vue
@@ -98,8 +98,6 @@ export default {
 
 
 
\ No newline at end of file
+
diff --git a/src/views/treeselect/TreeSelectDoc.vue b/src/views/treeselect/TreeSelectDoc.vue
index ac790d26a..4f75eb8ca 100644
--- a/src/views/treeselect/TreeSelectDoc.vue
+++ b/src/views/treeselect/TreeSelectDoc.vue
@@ -38,12 +38,11 @@ export default {
 

-import axios from 'axios';
-
 export default class NodeService {
 
     getTreeNodes() {
-        return axios.get('demo/data/treenodes.json').then(res => res.data.root);
+        return fetch('demo/data/treenodes.json').then(res => res.json())
+                .then(d => d.root);
     }
 
 }
@@ -587,7 +586,7 @@ export default {
         const selectedNode = ref();
         const selectedNodes1 = ref();
         const selectedNodes2 = ref();
-       
+
         return { options, selectedNode, selectedNodes1, selectedNodes2 };
     }
 }
diff --git a/src/views/treetable/TreeTableDoc.vue b/src/views/treetable/TreeTableDoc.vue
index 840dce91a..bb0fa20db 100755
--- a/src/views/treetable/TreeTableDoc.vue
+++ b/src/views/treetable/TreeTableDoc.vue
@@ -93,12 +93,11 @@ export default {
 

-import axios from 'axios';
-
 export default class NodeService {
 
     getTreeTableNodes() {
-        return axios.get('demo/data/treetablenodes.json').then(res => res.data.root);
+        return fetch('demo/data/treetablenodes.json').then(res => res.json())
+                .then(d => d.root);
     }
 
 }
@@ -1074,7 +1073,7 @@ export default {
 
Flex Scroll
-

In cases where viewport should adjust itself according to the table parent's height instead of a fixed viewport height, set scrollHeight option as flex. In example below, table is inside a Dialog where viewport size dynamically responds to the dialog size changes such as maximizing. +

In cases where viewport should adjust itself according to the table parent's height instead of a fixed viewport height, set scrollHeight option as flex. In example below, table is inside a Dialog where viewport size dynamically responds to the dialog size changes such as maximizing. FlexScroll can also be used for cases where scrollable viewport should be responsive with respect to the window size for full page scroll.