React sends out action, but can't change the value?

Why can"t I change the value when I send out action,?
git: https://gitee.com/ChuanChuan3.

clipboard.png

clipboard.png

clipboard.png

clipboard.png

import React, {Component} from "react"
import {
    ListItem,
    ListInfo,
    LoadMore
} from "../style";
import {
    connect
} from "react-redux";
import {
    Link
} from "react-router-dom";


class List extends Component {
    render() {
        const {
            list
        } = this.props;
        return (
            <div>
                {list}
            </div>
        )
    }
}

const mapState = (state) => {
   return {
       list: state.getIn(["home", "topicList"])
   }
         

}

const mapDispatch = (dispatch) => {

}

export default connect(mapState, null)(List);
import React, {Component} from "react"
import {
    connect
} from "react-redux";
import Topic from "./components/Topic";
import List from "./components/List";
import Recommend from "./components/Recommend";
import Writer from "./components/Writer";
import {
    HomeWrapper,
    HomeLeft,
    HomeRight
} from "./style";

import axios from "axios"

class Home extends Component {
    render() {
        return (
            <HomeWrapper>
                <HomeLeft>
                    <img className="banner-img" alt="" src="//upload.jianshu.io/admin_banners/web_images/4318/60781ff21df1d1b03f5f8459e4a1983c009175a5.jpg?imageMogr2/auto-orient/strip"imageView2/1/w/1250/h/540" />
                    <Topic />
                    <List />
                </HomeLeft>
                <HomeRight>
                    <Recommend />
                    <Writer />
                </HomeRight>
                {/* { this.props.showScroll ? <BackTop onClick={this.handleScrollTop}></BackTop> : null} */}
            </HomeWrapper>
        )
    }

    componentDidMount() {
        axios.get("/v2/movie/in_theaters").then((res) => {
            const data = res.data.subjects;
            console.log(res, data, "res")
            const action = {
                type: "change_home_data",
                topicList: data[0].casts,
                articleList: data[0].casts,
                recommendList: data[0].directors
            }
            this.props.changeHomeData(action)
        })
    }

}

const mapDispatch = (dispatch) => ({
    changeHomeData(action) {
         console.log(action, "action")
        dispatch(action)
    }

})


export default connect(null, mapDispatch)(Home);
Aug.10,2021

did you use immutableJs? Every operation of immutableJs returns a new object

state = state.merge({});

return state;

obviously, you are missing an assignment expression (state=)

Menu