react mobx有没有更简单的写法

DDD888

我感觉我写的下面的代码太复杂了

import React from 'react';
import ArticleList from "./ArticleList";
import ListErrors from "./ListErrors";
import { inject, observer } from "mobx-react";

const ArticleListContainer = inject('store')(observer(
    class ArticleListContainer extends React.Component {
        componentDidMount() {
            this.props.store.getArticleList();
        }

        render() {
            return (
                <div className="ArticleListContainer">
                    <ListErrors errors={this.props.store.errors}/>
                    <ArticleList />
                </div>
            )
        }
    }
));

export default ArticleListContainer;

有没有可能不用React.Component,直接用function?

kevinliang1976

个人喜好用 redux duck

mzbac

componentDidMount  都要取消了 还在用呢

DDD888

mzbac 发表于 2019-6-18 23:10
componentDidMount  都要取消了 还在用呢

const store = useContext(appStore);
useEffect(() => {
        store.getArticleList()
    }, []);

我用上面的代码来替换啦

DDD888

这是完整代码

import React, { useContext, useEffect } from 'react';
import ArticleList from "./ArticleList";
import ListErrors from "./ListErrors";
import { observer } from 'mobx-react-lite';
import appStore from '../stores/Store';

const ArticleListContainer = () => {
    const store = useContext(appStore)

    useEffect(() => {
        store.getArticleList()
    })

    return (
        <div className="ArticleListContainer">
            <ListErrors errors={store.errors}/>
            <ArticleList />
        </div>
    )
}

export default observer(ArticleListContainer)