react-lifecycle-component가 componentDidMount에 소품을 가지고 있습니다.

Question

반응 애플 리케이션에서 react-lifecycle-component을 사용하고 있습니다.이 상황에서 componentDidMount 콜백이 있어야 백엔드에서 일부 데이터를로드해야합니다. 무엇을 적재해야 하는지를 알기 위해서는 소도구가 필요합니다. 나는 그 소품을 회수 할 수있는 방법을 찾을 수 없습니다.

import { connectWithLifecycle } from "react-lifecycle-component"; 

import inspect from "../../../libs/inspect"; 
import fetchItem from "../actions/itemActions"; 
import ItemDetails from "../components/ItemDetails"; 

const componentDidMount =() => { 
    return fetchItem(props.match.params.number); 
}; 

// Which part of the Redux global state does our component want to receive as props? 
const mapStateToProps = (state, props) => { 
    return { 
    item: state.item, 
    user_location: state.user_location 
    }; 
}; 

// const actions = Object.assign(locationActions, lifecycleMethods); 
export default connectWithLifecycle(mapStateToProps, { componentDidMount })(
    ItemDetails 
); 

모든 단서 :

여기 내 컨테이너 구성 요소입니까?

감사합니다. 당신이 당신의 돌아 오는 저장소에서 가져 소품을 사용하는 어디 표시되지 않지만

Answer 1

import React, { Component } from 'react' 
import { connect } from 'react-redux' 
import fetchItem from '../actions/itemActions' 

class Container extends Component { 
    state = { 
    items: [] 
    } 

    componentDidMount() { 
     const { match } = this.props 
     fetchItem(match.params.number) 
     // if your fetchItem returns a promise 
     .then(response => this.setState({items: response.items})) 
    } 

    render() { 
     const { items } = this.state 
     return (
     <div> 
     { items.length === 0 ? <h2>Loading Items</h2> : 
      items.map((item, i) => (
      <ul key={i}>item</ul> 
      )) 
      } 
     </div> 
    ) 
    } 

const mapStateToProps = (state, props) => { 
    return { 
    item: state.item, 
    user_location: state.user_location 
    } 
} 

export default connect(mapStateToProps)(Container) 

...