每當商店更新時，我該如何進行ajax調用？

每次商店更新時，如何才能進行ajax調用？每當商店更新時，我該如何進行ajax調用？

基本上，我想用新的API參數來獲取產品，比方說，每個頁面的項目都有一個下拉菜單。它工作正常負載，即在方法的調用componentWillMount

但我不知道當商店更改時如何再次執行提取。

import React, { Component } from 'react'; 
 
import ProductsList from '../components/ProductsList' 
 
import { connect } from 'react-redux' 
 
// Action Creators 
 
import doFetchProducts from '../actions/doFetchProducts' 
 
import queryString from 'query-string' 
 

 
class Products extends Component { 
 

 
    constructor (props) { 
 
    super(props); 
 
    } 
 

 
    componentWillMount() { 
 
    this.fetch() 
 
    } 
 

 
    fetch() { 
 

 
    let q = queryString.stringify({ 
 
     categories: 'rings', 
 
     'attributes.Style': 'Classic', 
 
     limit: this.props.applyItemsPerPage, 
 
     page: 1, 
 
     status: 'Active' 
 
    }) 
 

 
    this.props.dispatch(
 
     doFetchProducts(q) 
 
    ) 
 
    } 
 

 
    render() { 
 

 
    return (
 
     <section className="content"> 
 
     <ProductsList {...this.props} /> 
 
     </section> 
 
    ); 
 
    } 
 

 
} 
 
const mapStateToProps = state => { 
 
    return { 
 
    products: state.applyFetchProducts.products, 
 
    isLoading: state.applyFetchProducts.isLoading, 
 
    itemsPerPage: state.applyItemsPerPage 
 
    } 
 
} 
 

 
export default connect(
 
    mapStateToProps 
 
)(Products);

在此先感謝。

來源

2017-08-16 Mohan Dere

你的意思是你想在組件更新時做ajax調用嗎？你應該可以使用'componentWillRecieveProps'。查看：https：//facebook.github.io/react/docs/react-component.html#componentwillreceiveprops –

您可以使用Redux的store.subscribe來監聽更改。

componentWillMount() { 
    this.unsubscribeStore = store.subscribe(this.onStoreChange); 

    this.setState({ 
    currentState: store.getState() 
    }); 
} 

componentWillUnmount() { 
    this.unsubscribeStore(); 
} 

onStoreChange =() => { 
    const newState = store.getState(); 

    // Check the relevant part of store for changes. 
    // Depends on your store implementation 
    if (newState.reducer.prop !== this.state.currentState.reducer.prop) { 
    this.fetch(); 
    } 
}

this.onStoreChange將調用每個調度，所以要小心，不要創建無限循環。這也是您執行回調函數時必須手動檢查更改的原因。

來源

2017-08-16 19:49:26 NiFi

如果要在商店更改時進行AJAX調用，請使用生命週期鉤子componentWillReceiveProps。文檔爲here.

此：每一個商店的變化，因爲它會觸發知道它的分量正在接收新道具

將因此重新渲染時間

上運行。

來源

2017-08-17 03:27:12 gabrielwr

每當商店更新時，我該如何進行ajax調用？

回答

相關問題