Remove axios

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",

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);
     }
 }

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);
+        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);
+        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);
+        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);
+        return fetch('demo/data/customers-xlarge.json').then(res => res.json())
+                .then(d => d.data);
     }
 
     getCustomers(params) {
-    return axios.get('https://www.primefaces.org/data/customers', { params }).then(res => res.data)
+        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())
     }
 }

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);
     }
 }

src/service/NodeService.js

@@ -1,15 +1,12 @@
-import axios from 'axios';
-
 export default class NodeService {
 
     getTreeTableNodes() {
-        return axios.get('demo/data/treetablenodes.json')
+        return fetch('demo/data/treetablenodes.json').then(res => res.json())
-                .then(res => res.data.root);
+                .then(d => d.root);
     }
 
     getTreeNodes() {
-        return axios.get('demo/data/treenodes.json')
+        return fetch('demo/data/treenodes.json').then(res => res.json())
-                .then(res => res.data.root);
+                .then(d => d.root);
     }
-
 }

src/service/PhotoService.js

@@ -1,9 +1,7 @@
-import axios from 'axios'
-
 export default class PhotoService {
 
 	getImages() {
-        return axios.get('demo/data/photos.json')
+        return fetch('demo/data/photos.json').then(res => res.json())
-                .then(res => res.data.data);
+                .then(d => d.data);
     }
 }

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);
 	}
 }

src/views/datatable/DataTableDoc.vue

@@ -11,23 +11,21 @@ import ColumnGroup from 'primevue/columngroup';     //optional for column groupi
 
             <h5>Getting Started</h5>
             <p>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.</p>
+                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.</p>
 
             <pre v-code.script><code>
-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);
 	}
 }
 

src/views/galleria/GalleriaDoc.vue

@@ -121,12 +121,11 @@ import Galleria from 'primevue/galleria';
 </div>
 
 <pre v-code.script><code>
-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);
     }
 }
 

src/views/icons/Icons.vue

@@ -98,8 +98,6 @@ export default {
 </template>
 
 <script>
-import axios from 'axios';
-
 export default {
     data() {
         return {
@@ -108,8 +106,9 @@ export default {
         }
     },
     mounted() {
-        axios.get('demo/data/icons.json').then(res => {
+        fetch('demo/data/icons.json', { headers: { 'Cache-Control' : 'no-cache' } }).then(res => res.json())
-            let icons = res.data.icons;
+            .then(d => {
+                let icons = d.icons;
                 icons.sort((icon1, icon2) => {
                     if(icon1.properties.name < icon2.properties.name)
                         return -1;

src/views/liveeditor/LiveEditor.vue

@@ -94,7 +94,6 @@ export default {
                             dependencies: {
                                 ...extDependencies,
                                 'vue': dependencies['vue'],
-                                'axios': dependencies['axios'],
                                 'primevue': '^3.7.2',
                                 'primeflex': dependencies['primeflex'],
                                 'primeicons': dependencies['primeicons'],

src/views/liveeditor/LiveEditorData.js

@@ -1,96 +1,87 @@
 const services = {
     'CountryService': `
-import axios from 'axios'
-
 export default class CountryService {
 
     getCountries() {
-        return axios.get('data/countries.json').then(res => res.data.data);
+        return fetch('demo/data/countries.json').then(res => res.json())
+            .then(d => d.data);
     }
 }
     `,
     'CustomerService': `
-import axios from 'axios'
-
 export default class CustomerService {
 
     getCustomersSmall() {
-        return axios.get('data/customers-small.json').then(res => res.data.data);
+        return fetch('demo/data/customers-small.json').then(res => res.json())
+                .then(d => d.data);
     }
 
     getCustomersMedium() {
-        return axios.get('data/customers-medium.json').then(res => res.data.data);
+        return fetch('demo/data/customers-medium.json').then(res => res.json())
+                .then(d => d.data);
     }
 
     getCustomersLarge() {
-        return axios.get('data/customers-large.json').then(res => res.data.data);
+        return fetch('demo/data/customers-large.json').then(res => res.json())
+                .then(d => d.data);
     }
 
     getCustomersXLarge() {
-        return axios.get('data/customers-xlarge.json').then(res => res.data.data);
+        return fetch('demo/data/customers-xlarge.json').then(res => res.json())
+                .then(d => d.data);
     }
 
     getCustomers(params) {
-        return axios.get('https://www.primefaces.org/data/customers', { params }).then(res => res.data)
+        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())
     }
 }
     `,
     'EventService': `
-import axios from 'axios';
-
 export default class EventService {
 
     getEvents() {
-        return axios.get('data/events.json').then(res => res.data.data);
+        return fetch('demo/data/events.json').then(res => res.json())
+                .then(d => d.data);
     }
 }
     `,
     'NodeService': `
-import axios from 'axios';
-
 export default class NodeService {
 
     getTreeTableNodes() {
-        return axios.get('data/treetablenodes.json')
+        return fetch('demo/data/treetablenodes.json').then(res => res.json())
-            .then(res => res.data.root);
+                .then(d => d.root);
     }
 
     getTreeNodes() {
-        return axios.get('data/treenodes.json')
+        return fetch('demo/data/treenodes.json').then(res => res.json())
-            .then(res => res.data.root);
+                .then(d => d.root);
     }
-    
 }
     `,
     'PhotoService': `
-import axios from 'axios'
-
 export default class PhotoService {
 
     getImages() {
-        return axios.get('data/photos.json')
+        return fetch('demo/data/photos.json').then(res => res.json())
-            .then(res => res.data.data);
+                .then(d => d.data);
     }
 }
 `,
     'ProductService': `
-import axios from 'axios';
-
 export default class ProductService {
 
     getProductsSmall() {
-        return axios.get('data/products-small.json')
+		return fetch('demo/data/products-small.json').then(res => res.json()).then(d => d.data);
-            .then(res => res.data.data);
 	}
 
 	getProducts() {
-        return axios.get('data/products.json')
+		return fetch('demo/data/products.json').then(res => res.json()).then(d => d.data);
-            .then(res => res.data.data);
     }
 
     getProductsWithOrdersSmall() {
-        return axios.get('data/products-orders-small.json')
+		return fetch('demo/data/products-orders-small.json').then(res => res.json()).then(d => d.data);
-            .then(res => res.data.data);
 	}
 }
 

src/views/tree/TreeDoc.vue

@@ -112,12 +112,11 @@ export default {
 </code></pre>
 
 <pre v-code.script><code>
-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);
     }
 
 }

src/views/treeselect/TreeSelectDoc.vue

@@ -38,12 +38,11 @@ export default {
 </code></pre>
 
 <pre v-code.script><code>
-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);
     }
 
 }

src/views/treetable/TreeTableDoc.vue

@@ -93,12 +93,11 @@ export default {
 </code></pre>
 
 <pre v-code.script><code>
-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);
     }
 
 }