En mi aplicación, envío una solicitud a mi aplicación de back-end de la que recibo una respuesta con una identificación como { 'id': '12345'}
. Guardo esta id
como loadId
dentro de los datos, aquí:
export default { name: 'SyncProducts', data() { return { loadId: '',
Ahora quiero enviar otro POST fetchSyncedProductsResultRequest
cuando este loadId
de carga de datos cambie de estar vacío. ¿Cómo hacerlo?
Debajo de mi código:
imports.js
const createApparelMagicProductsRequest = (self, products) => { const jwtToken = self.$store.state.idToken; console.log(products) console.log() const payload = JSON.stringify({ product_codes: products['product_codes'].split(',') }) return axios .post(`/api/v1/imports/products_batches`, payload,{ headers: { Authorization: `Bearer ${jwtToken}`, 'Content-Type': 'application/json', 'Accept': 'application/json' } }) .then(response => response.data['id']) }; const fetchSyncedProductsResultRequest = (token, id) => { return axios .get(`/api/v1/imports/products_batches`, { params: { id: id }, headers: { Authorization: `Bearer ${token}`, } }) .then(response => { return response.data['result'] }) };
sync_products.vue
<script> import { fetchSyncedProductsResultRequest, createApparelMagicProductsRequest } from '../../api/imports' export default { name: 'SyncProducts', data() { return { styleCodes: [], fetchedProductSyncResult: [], loadId: '', } }, async mounted() { await fetchSyncedProductsResultRequest(this, load.id) this.syncedProductsFetched = true this.pageChanged(this.currentPage) }, async mounted() { const jwtToken = this.$store.state.idToken; fetchSyncedProductsResultRequest(jwtToken).then(data => { this.fetchedProductSyncResult = data }) }, </script>
Use un observador en loadId
que llame a fetchSyncedProductsResultRequest()
con el nuevo valor si se cambia de una cadena vacía a una cadena no vacía:
export default { watch: { loadId(newValue, oldValue) { if (!oldValue && newValue) { const jwtToken = this.$store.state.idToken; fetchSyncedProductsResultRequest(jwtToken, newValue).then(data => { this.fetchedProductSyncResult = data }); } } } }