使用react原生和redux实现“like tweet”功能的更好方法

// tweetsReducer.js
const initialState = [];

const tweetsReducer = (state = initialState, action) => {
  switch (action.type) {
    case 'LIKE_TWEET':
      return state.map(tweet => {
        if (tweet.id === action.payload.tweetId) {
          return {
            ...tweet,
            liked: !tweet.liked
          };
        }
        return tweet;
      });
    default:
      return state;
  }
};

export default tweetsReducer;

// actions.js
export const likeTweet = tweetId => ({
  type: 'LIKE_TWEET',
  payload: {
    tweetId
  }
});

// TweetList.js
import React from 'react';
import { connect } from 'react-redux';
import { likeTweet } from './actions';

const TweetList = ({ tweets, likeTweet }) => {
  return (
    <div>
      {tweets.map(tweet => (
        <div key={tweet.id}>
          <p>{tweet.text}</p>
          <button onClick={() => likeTweet(tweet.id)}>
            {tweet.liked ? 'Unlike' : 'Like'}
          </button>
        </div>
      ))}
    </div>
  );
};

const mapStateToProps = state => ({
  tweets: state.tweets
});

const mapDispatchToProps = {
  likeTweet
};

export default connect(mapStateToProps, mapDispatchToProps)(TweetList);