Question

我考虑为连接的React-Redux组件使用更严格的类型。

const ConnectedSelectionFilter = connect(mapsStateToProps, mapDispatchToProps)(SelectionFilter)

React-Redux的通用类型ConnectedComponentClass需要2个类型参数

ConnectedComponentClass<C, P> = ComponentClass<JSX.LibraryManagedAttributes<C, P>, any> & {
    WrappedComponent: C;
}

C显然是指包装的组件，但是我不确定P是指什么。我尝试了ComponentProps（尽管可以从组件类型中提取）和ownProps，但是它不起作用。

我应该如何使用这种通用类型？一个例子会有所帮助。

Answer 1

通常，您不需要直接使用ConnectedComponentClass。

常见且正确的方法是执行以下操作：

                  for(int i=0;i<model.size();i++){
                   JSONArray replyArrays = replyObject.getJSONArray(String.valueOf(model.get(i).comment_id));
                  //Initialise inside the loop 
                  ArrayList<ReplyCommentModel> replyModel = new ArrayList();
                   for(int j=0;j<replyArrays.length();j++){
                       JSONObject jsonObject1 = replyArrays.getJSONObject(j);
                       Integer id = jsonObject1.getInt("id");
                       String name = jsonObject1.getString("name");
                       String comment_image = jsonObject1.getString("photo");
                       Integer user_id = jsonObject1.getInt("user_id");
                       String comment = jsonObject1.getString("comment");
                       String added_on = jsonObject1.getString("addedon");
                       String imageURl = Constant.IMAGE_URL+Constant.COMMENT_USER_IMAGE_URL+comment_image;
                       replyModel.add(new ReplyCommentModel(comment,name,imageURl,added_on,user_id,id));
                   }
                   if(replyModel != null){
                       replyModelMap.put(String.valueOf(model.get(i).comment_id),replyModel);

                   }
               }

StateProps是从Redux状态派生的属性。

调度道具只能是您的调度功能，也可以是更多调度功能。

connect<StateProps, DispatchProps, OwnProps, State>(mapStateToProps)(ComponentHere);

OwnProps-组件的自身属性。

状态-您的redux状态。

如果您导入组件并需要动态创建它们，例如

ConnectedComponentClass可能有用。您想让不同的组件在数组中共享相同的属性，然后根据您的状态创建它们。

export interface DispatchProps {
    dispatch: Dispatch;
}

使用Typescript编写的ConnectedComponentClass类型React-Redux

1 个答案: