Recompose - mapPropsとwithPropsは小道具を更新していません

Question

ロスターのソート順、方向、性別フィルターを管理したいコンテナがあります。私は、名簿はwithPropsの内側に正しく更新されます下の現在のwithPropsコードの両方のwithPropsとmapProps試してみましたが、それはレスラーコンポーネントの既存の名簿を上書き

import { compose, withState, withProps, withHandlers } from "recompose" 
 
import { connect } from "react-redux" 
 
import sortBy from "lodash/sortBy" 
 

 

 
// container 
 
export default compose(
 
    withState("male", "toggleGender", true), 
 
    withState("sortByName", "toggleSortByName", true), 
 
    withState("order", "toggleOrder", true), 
 
    withHandlers({ 
 
    toggleGender: ({ toggleGender, male, }) =>() => toggleGender(!male), 
 
    toggleSortByName: ({ toggleSortByName, sortByName, }) =>() => 
 
     toggleSortByName(!sortByName), 
 
    toggleOrder: ({ toggleOrder, order, }) =>() => toggleOrder(!order), 
 
    }), 
 
    connect(state => ({ 
 
    roster: state.roster, 
 
    })), 
 
    withProps(props => { 
 
    const { roster, toggleOrder, male, sortByName, } = props 
 

 
    let newRoster = Object.assign([], roster) 
 

 
    newRoster = newRoster.filter(wrestler => wrestler.male === male) 
 

 
    if (toggleOrder) { 
 
     newRoster = newRoster.reverse() 
 
    } 
 

 
    newRoster = sortBy(newRoster, sortByName ? "name" : "points") 
 

 
    return { 
 
     roster: newRoster, 
 
     ...props, 
 
    } 
 
    }) 
 
)(Wrestlers)

Answer 1

よくありませんそれは愚かだった、私は戻るの順序を変更する必要があった、私はまた、いくつかの他の未成年者を固定

import { compose, withState, withProps, withHandlers } from "recompose" 
import { connect } from "react-redux" 
import sortBy from "lodash/sortBy" 

import Wrestlers from "./wrestlers" 

export default compose(
    withState("male", "toggleGender", true), 
    withState("sortByName", "toggleSortByName", true), 
    withState("order", "toggleOrder", true), 
    withHandlers({ 
    toggleGender: ({ toggleGender, male, }) =>() => toggleGender(!male), 
    toggleSortByName: ({ toggleSortByName, sortByName, }) =>() => 
     toggleSortByName(!sortByName), 
    toggleOrder: ({ toggleOrder, order, }) =>() => toggleOrder(!order), 
    }), 
    connect(state => ({ 
    roster: state.roster, 
    })), 
    withProps(props => { 
    const { roster, order, male, sortByName, } = props 

    let newRoster = Object.assign([], roster) 

    newRoster = newRoster.filter(wrestler => wrestler.male === male) 

    newRoster = sortBy(newRoster, sortByName ? "name" : "points") 

    if (order) { 
     newRoster = newRoster.reverse() 
    } 

    return { 
     ...props, 
     roster: newRoster, 
    } 
    }) 
)(Wrestlers)