React Native/Redux - 無法訪問Redux存儲

Question

我試圖訪問我正在處理的React Native組件中的Redux存儲的兩個部分，並且由於某種原因，可能是簡單的，我不能讓事情奏效。

我傳遞了orderID作爲屬性的組件，然後我要檢索從終極版存儲適當的訂單詳情：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); 

有什麼建議？

Answer 1

OrderDetail是一個無狀態功能組件，功能組件沒有this關鍵字。

可能這就是你想要的東西：

const OrderDetail = (props) => { 
    const order = props.orders[props.orderID]; 
    // ...