我必须显示用户列表,单击按钮后,我想在按钮内显示文本。 UserHeader是我从记录列表中导入的组件。我意识到的是,一旦单击按钮,动作就会在所有list元素上受到影响,我认为这是因为reducer的状态数组被记录填充,并且每次我显示UserHeader时,它都会在按钮内显示文本。我只想在已经处理的列表元素上显示文本,而不是整个列表。请帮我怎么做。
import React from 'react';
import { connect } from 'react-redux';
import { fetchUser, selectPost } from '../actions';
class UserHeader extends React.Component {
render() {
return <button onClick={this.props.selectPost} className="header"> {this.props.select} </button>
}
}
const mapStateToProps = (state, ownProps) => {
return {
select: state.select
};
}
export default connect(mapStateToProps, { selectPost })(UserHeader);
//Reducer.js
export const Reducer_posts = (state=[], action) => {
switch (action.type){
case 'FETCH_POSTS':
return action.payload
default:
return state;
}
};
export const Reducer_users = (state=[], action) => {
switch (action.type){
case 'FETCH_USER':
return [...state, action.payload];
default:
return state;
}
};
export const Reducer_select = (state=[], action) => {
switch (action.type){
case 'SELECT_POST':
return action.payload;
default:
return state;
}
};