新西兰天维网社区

标题: react mobx有没有更简单的写法 [打印本页]

作者: DDD888    时间: 2019-6-16 10:58:28     标题: react mobx有没有更简单的写法

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


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;






作者: DDD888    时间: 2019-6-16 11:00:31

有没有可能不用React.Component,直接用function?
作者: 匿名    时间: 2019-6-16 12:43:51

作为“资深”程序员,你不会用stack overflow 吗?成天来FML问代码问题?

作者: Venox10111    时间: 2019-6-16 12:53:02

匿名者 发表于 2019-6-16 12:43
作为“资深”程序员,你不会用stack overflow 吗?成天来FML问代码问题?

资深程序员才不用stackoverflow 呢。人是来考大家技术水平的
作者: 匿名    时间: 2019-6-16 12:54:42

Venox10111 发表于 2019-6-16 12:53
资深程序员才不用stackoverflow 呢。人是来考大家技术水平的

然后抄完答案给老板显摆一下,自己加一把薪?

作者: DDD888    时间: 2019-6-16 14:57:32

匿名者 发表于 2019-6-16 12:54
然后抄完答案给老板显摆一下,自己加一把薪?

为何知道这答案可以加一把薪?
作者: 匿名    时间: 2019-6-16 19:21:23

本帖最后由 匿名 于 2019-6-16 19:27 编辑

LZ侧写: 年龄 40~50, 中年危机+职场透明人。 夫妻生活无交流,孩子叛逆不理解, 无性生活。 职场多年做不到管理层,一直底层作CRUD级别码农,学习能力不如年轻人。职业生涯没盼头,只能找个地方论坛写点东西。

作者: salesonline    时间: 2019-6-16 19:34:40

楼主就是想多交几个程序员朋友而已,不过你忘了,写代码的一般都比较宅,也比较独
作者: 匿名    时间: 2019-6-16 20:01:52

这个是不是发到技术交流板块比较好啊?

作者: Venox10111    时间: 2019-6-16 23:03:55

匿名者 发表于 2019-6-16 19:21
LZ侧写: 年龄 40~50, 中年危机+职场透明人。 夫妻生活无交流,孩子叛逆不理解, 无性生活。 职场多年做 ...

人艰不拆。。。。。
作者: 匿名    时间: 2019-6-16 23:16:29

Venox10111 发表于 2019-6-16 23:03
人艰不拆。。。。。

嗯,看到这种Hello world级别的东西,发出来得瑟的,忍不住怼了!

作者: ZYC123    时间: 2019-6-17 02:33:18

匿名者 发表于 2019-6-16 23:16
嗯,看到这种Hello world级别的东西,发出来得瑟的,忍不住怼了!

19.png


图片附件: 19.png (2019-6-17 02:33:13, 57.06 KB) / 下载次数 1
http://bbs.skykiwi.com/forum.php?mod=attachment&aid=MjE0NjgwOHw3MThkZDU5YnwxNzE2MzM4ODU3fDB8MA%3D%3D


作者: Venox10111    时间: 2019-6-17 10:26:32

匿名者 发表于 2019-6-16 23:16
嗯,看到这种Hello world级别的东西,发出来得瑟的,忍不住怼了!

新西兰待久了也就这个水平了,能写写 helloworld, crud 都不错了。。。
这里软件业务不是刚需,只是辅助传统业务的工具。

作者: DDD888    时间: 2019-6-17 10:54:26

Venox10111 发表于 2019-6-17 10:26
新西兰待久了也就这个水平了,能写写 helloworld, crud 都不错了。。。
这里软件业务不是刚需,只是辅助 ...

我诚实的说,我1998年的时候写过点delphi的crud,后来就没机会写啦,十多年前写两三页的microsoft sql server stored procedure,现在写一页左右的sql啦
作者: Venox10111    时间: 2019-6-17 10:57:00

DDD888 发表于 2019-6-17 10:54
我诚实的说,我1998年的时候写过点delphi的crud,后来就没机会写啦,十多年前写两三页的microsoft sql ser ...

Dephi 的精髓是 VCL 控件,当年没少写VCL 控件,还写了一个类似迅雷的VCL。现在还在写 SQL, 数据读写不是做 CRUD 么?
作者: DDD888    时间: 2019-6-17 11:03:24

Venox10111 发表于 2019-6-17 10:57
Dephi 的精髓是 VCL 控件,当年没少写VCL 控件,还写了一个类似迅雷的VCL。现在还在写 SQL, 数据读写不是 ...

我同事写crud啦,我不管啦,我只管网站和android,ios app啦,老板说请我就是为客户写网站啦
作者: salesonline    时间: 2019-6-17 22:19:35

Venox10111 发表于 2019-6-17 10:57
Dephi 的精髓是 VCL 控件,当年没少写VCL 控件,还写了一个类似迅雷的VCL。现在还在写 SQL, 数据读写不是 ...

哇,都说到delphi啦,那都要回到15年前了  
作者: Venox10111    时间: 2019-6-17 22:31:31

salesonline 发表于 2019-6-17 22:19
哇,都说到delphi啦,那都要回到15年前了

实际上我 Turbo Pascal 玩的更好,很早就用 TP 做了自己的数据库查询系统了。。。
作者: 匿名    时间: 2019-6-18 14:13:40

用 redux 吧 觉得更好了解

作者: DDD888    时间: 2019-6-18 14:50:11

匿名者 发表于 2019-6-18 14:13
用 redux 吧 觉得更好了解

那是给自己找代码写啦,多余的敲键盘啦
作者: 包不同    时间: 2019-6-18 14:50:41

用了都25年还没搞懂的问题,一定是个很难的问题!!!
作者: DDD888    时间: 2019-6-18 15:01:52

包不同 发表于 2019-6-18 14:50
用了都25年还没搞懂的问题,一定是个很难的问题!!!

https://en.wikipedia.org/wiki/React_(JavaScript_library)

react 2013年才发布啦
作者: ilmaro    时间: 2019-6-18 15:08:29

匿名者 发表于 2019-6-16 19:21
LZ侧写: 年龄 40~50, 中年危机+职场透明人。 夫妻生活无交流,孩子叛逆不理解, 无性生活。 职场多年做 ...







我一口功夫茶直接喷在键盘上了!!!!


你!!!!
作者: tanky    时间: 2019-6-18 15:53:39

匿名者 发表于 2019-6-16 19:21
LZ侧写: 年龄 40~50, 中年危机+职场透明人。 夫妻生活无交流,孩子叛逆不理解, 无性生活。 职场多年做 ...

精辟........此处省略一万字
作者: auckland.clark    时间: 2019-6-18 16:01:04

匿名者 发表于 2019-6-16 19:21
LZ侧写: 年龄 40~50, 中年危机+职场透明人。 夫妻生活无交流,孩子叛逆不理解, 无性生活。 职场多年做 ...

不要这样调侃。
搞技术的不少人,是不善于和人交流的,这个很普遍。
作者: salesonline    时间: 2019-6-18 20:54:44

Venox10111 发表于 2019-6-17 22:31
实际上我 Turbo Pascal 玩的更好,很早就用 TP 做了自己的数据库查询系统了。。。 ...

哇,教科书级的编程软件啦            
作者: catalsdevelop    时间: 2019-6-19 09:56:05

喜欢双向绑定,直接用vue啊
作者: DDD888    时间: 2019-6-19 10:16:46

catalsdevelop 发表于 2019-6-19 09:56
喜欢双向绑定,直接用vue啊

我挺喜欢react的
作者: haohmarucj    时间: 2019-6-19 10:54:48

LZ已经不甘心只谈工资,开始论坛写代码了

作者: DDD888    时间: 2019-6-19 10:57:41

haohmarucj 发表于 2019-6-19 10:54
LZ已经不甘心只谈工资,开始论坛写代码了

我在学习,有问题就问啦
作者: 匿名    时间: 2019-6-19 12:49:22

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

export default ArticleListContainer = observer(() => {
    const [errors] = useContext(YourStore);
    return  (
        <div className="ArticleListContainer">
            <ListErrors errors={errors}/>
            <ArticleList />
        </div>
     )
});
作者: DDD888    时间: 2019-6-19 13:46:05

匿名者 发表于 2019-6-19 12:49
import React from 'react';
import ArticleList from "./ArticleList";
import ListErrors from "./ListEr ...

谢谢参与,在哪里call store.getArticleList()?
作者: ilmaro    时间: 2019-6-19 13:52:18

DDD888 发表于 2019-6-19 10:57
我在学习,有问题就问啦



在这个贴子里,你学习到什么了吗?
作者: DDD888    时间: 2019-6-20 10:07:21

匿名者 发表于 2019-6-19 12:49
import React from 'react';
import ArticleList from "./ArticleList";
import ListErrors from "./ListEr ...

我找到了答案,在你的代码里加句话

const store = useContext(appStore);
useEffect(() => {
        store.getArticleList()
    }, []);
作者: DDD888    时间: 2019-6-20 10:08:45

ilmaro 发表于 2019-6-19 13:52
在这个贴子里,你学习到什么了吗?

如果我不发帖,我大概就不会去学习hook, mobx-react-lite
作者: ilmaro    时间: 2019-6-20 10:09:54

DDD888 发表于 2019-6-20 10:08
如果我不发帖,我大概就不会去学习hook, mobx-react-lite



挺好,有学到就好……。
作者: DDD888    时间: 2019-6-20 20:15:35

本帖最后由 DDD888 于 2019-6-20 20:53 编辑

这是完整代码


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)





欢迎光临 新西兰天维网社区 (http://bbs.skykiwi.com/) Powered by Discuz! X2