2016-12-04 47 views
0

我正在学习如何在react-native中设置异步API调用。我正在使用axios。我正在发送ComponentDidMount的调度表,它正在成功更改/更新我的一般状态。问题是我似乎无法使用这个“数据”。React-Native在ComponentDidUpdate调用Async后没有合并道具

import React, { Component, PropTypes } from 'react' 
import { StyleSheet, View, Text, TouchableOpacity } from 'react-native' 
import { connect } from 'react-redux' 
import { getMakes} from "../actions/getPrice" 
import * as PriceActions from '../actions/getPrice' 


@connect((store) => { 
    return { 
    cars: store.cars 
    }; 
}) 
export default class CounterContainer extends Component { 

    constructor(props) { 
    super(props); 
    this.state = { 
     cars: { 

     } 
    } 
    } 

    componentDidMount() { 
    this.props.dispatch(getMakes()) 
    } 


    render() { 
    return (
     <View style={styles.container}> 

     <TouchableOpacity> 
      <Text style={styles.back}>Data: {this.props.cars.modelsCount}</Text> 
     </TouchableOpacity> 
     </View> 
    ); 
    } 
} 

由于动作正常,它必须是我的减速器的问题?它的内容如下:

function getPrice(state={ 
    cars: [], 
    fetching: false, 
    fetched: false, 
    error: null, 
    }, action) { 
    switch (action.type) { 
     case "FETCH_CARS": { 
     return {...state, fetching: true} 
     } 
     case "FETCH_CARS_REJECTED": { 
     return {...state, fetching: false, error: action.payload} 
     } 
     case "FETCH_CARS_FULFILLED": { 
     return { 
      ...state, 
      fetching: false, 
      fetched: true, 
      cars: action.payload, 
     } 
     } 
    } 
    return state 
} 

export default getPrice; 

enter image description here

回答

1

mapStateToProps需要整个状态树作为第一个参数。 如果state上的截图是完整的终极版状态,然后connecto应该是这样的:

@connect((store) => { 
    return { 
    cars: store.priceReducer.cars 
    }; 
}) 
+0

哇,无法相信我错过了。谢谢。 – Matty

相关问题