0
私が作業しているReact Nativeコンポーネント内のReduxストアの2つの部分にアクセスしようとしています。物事を働かせる。React Native/Redux React - Reduxストアにアクセスできない
私は、コンポーネントにプロパティとしてorderID
を渡しているし、私はReduxのストアから適切な注文の詳細を取得したい:orders[orderID]
が、ローカル変数を割り当てるしようとすると:
const order = this.props.orders[orderID];
私はエラー:Cannot read property 'orders' of undefined
、すなわち:何らかの理由で、Reduxストアのorders
の一部がコンポーネントの小道具にconnect
を持っていないように見えます。
import React from 'react';
import { connect } from 'react-redux';
import {
View,
Text
} from 'react-native';
import Status from '../Status';
import Card from './Card';
import CardSection from './CardSection';
const OrderDetail = ({ orderID }) => {
const order = this.props.orders[orderID];
const {
id,
status,
gross_price,
currency_symbol,
bookings
} = order;
return (
<Card>
<CardSection>
<View style={styles.headerContentStyle}>
<View style={styles.bookingIdHeaderContainerStyle}>
<Text style={styles.headerTextStyle}>Booking #{id}</Text>
</View>
<View style={styles.grossPriceHeaderContainerStyle}>
<Text style={styles.headerTextStyle}>{currency_symbol}{gross_price}</Text>
</View>
<View style={styles.statusHeaderContainerStyle}>
<Status status={status} />
</View>
</View>
</CardSection>
<CardSection>
<View style={styles.orderListContentStyle}>
<Text>Booking #1234</Text>
</View>
</CardSection>
</Card>
);
};
const styles = {
headerContentStyle: {
flex: 1,
flexDirection: 'row',
alignItems: 'center'
},
headerTextStyle: {
fontSize: 18
},
bookingIdHeaderContainerStyle: {
flex: 5
},
grossPriceHeaderContainerStyle: {
flex: 2
},
statusHeaderContainerStyle: {
flex: 2
},
orderListContentStyle: {
}
};
const mapStateToProps = state => {
return ({
orders: state.orders,
bookings: state.bookings
});
};
export default connect(mapStateToProps)(OrderDetail);
任意の提案を次のように
コードはありますか?
バン上:
が、これはあなたが望んでいるように。私はそれについて知らなかった。毎日何かを学ぶ... ありがとう! –