Redux connect() với các hành động bội số/tiểu bang

Question

Cách thích hợp để kết nối nhiều tiểu bang với người tạo hành động tương ứng trong Redux là gì? Và đó là một ý tưởng hay? Làm thế nào tôi có thể làm việc xung quanh rằng nếu đó là một ý tưởng ngu ngốc?

export default connect(

// which part of the Redux global state does 
// our component want to receive as props? 
(state) => { 
    return { 
    state: state.instagram 
    }; 
}, 

// which action creators does 
// it want to receive by props? 
(dispatch) => { 
    return { 
    actions: bindActionCreators(instagramActions, dispatch) 
    }; 
} 

)(FeedContainer); 

Những gì tôi về cơ bản muốn là một cái gì đó như thế này:

... 
state: {state.instagram, state.facebook} 
... 

... 
const mergedActions = {instagramActions, facebookActions}; 
actions: bindActionCreators(mergedActions , dispatch) 
... 

Answer 1

Sử dụng callbacks mapStateTopProps và mapDispatchToProps cung cấp là cách thích hợp để kết nối thành phần của bạn với một tập hợp con lọc của tiểu bang và actionCreators đã bị ràng buộc.

Để đạt được những gì bạn muốn, bạn chỉ có thể làm:

(state) => { 
    const { instagram, facebook } = state; 
    return { 
    state: { instagram, facebook } 
    }; 
} 

và

(dispatch) => { 
    return { 
    actions: bindActionCreators(Object.assign({}, instagramActions, facebookActions), dispatch) 
    }; 
} 

này không hoạt động:

actions: bindActionCreators({instagramActions, facebookActions} , dispatch) 

như phương pháp này không hỗ trợ đối tượng lồng nhau chưa . See code here. Nó chỉ lặp qua các phím và tìm kiếm các chức năng.

Trong mapDispatchToProps bạn gọi lại bạn có thể rời khỏi lớp nhà nước thêm đi

(state) => { 
    const { instagram, facebook } = state; 
    return { 
     instagram, 
     facebook 
    }; 
} 

Bằng cách này bạn có thể truy cập vào các đạo cụ với:

this.props.facebook và this.props.instagram thay vì this.props.state.facebook và this.props.state.instagram. Nhưng đây chỉ là một câu hỏi về phong cách mà tôi nghĩ.

Có một số cách để gắn kết trạng thái của bạn và gửi đến đạo cụ. Cuối cùng nó là một câu hỏi về phong cách. Tôi có thể cung cấp một số ví dụ khác nhau về cách thực hiện, nhưng tốt hơn hãy xem tài liệu chính thức và tìm phong cách của riêng bạn https://github.com/reactjs/react-redux/blob/master/docs/api.md