小编Hoa*_*inh的帖子

React 父子组件中 useEffect 的正确执行顺序是什么?

例如,如果我有组件 A 和 B,并且组件 B 是组件 A 的子级:

<A>
  <B />
</A>
Run Code Online (Sandbox Code Playgroud)

在 A 中,我们有:

useEffect(() => {
  console.log('Parent A useEffect')
})
Run Code Online (Sandbox Code Playgroud)

在 B 中,我们有:

useEffect(() => {
  console.log('Child B useEffect')
})
Run Code Online (Sandbox Code Playgroud)

我做了一些测试,我看到了两件事:

  1. 在第一次加载时(例如在 F5 之后),日志结果是:

父 A 使用效果

儿童B使用效果

  1. 如果我们转到另一个组件,然后又回到组件 B(例如,不是通过重新加载而是通过使用 react-router),则日志结果为:

儿童B使用效果

父 A 使用效果

在两种情况下,结果是相反的。这让我有点困惑。

我搜索了谷歌componentDidMount,我发现了这个:https : //github.com/facebook/react/blob/v15.0.1/docs/docs/ref-03-component-specs.md#mounting-componentdidmount

componentDidMount()子组件的方法先于父组件调用。

但我找不到有关的相应文档 useEffect

那么useEffect父/子组件中正确的执行顺序是什么?

reactjs use-effect

15
推荐指数
1
解决办法
7363
查看次数

在导航抽屉中具有多个片段的活动中按后退按钮时退出应用程序

我正在开发一款需要导航抽屉的应用.这个应用程序有1个MainActivity和大约10个片段.当我单击MainActivity中的导航抽屉图标时,它将显示10个片段,以便我可以选择每个片段.

我选择片段A,然后选择B,然后选择C ...到F.当我在片段F并按下后退按钮时,它会将我带回片段E,然后再返回它将带我去片段D ...

我的问题是,当我回到片段A(当然是从片段B)并再次按下"返回"按钮时,它会将我带到一个空白的白色屏幕(我认为这是主要的活动布局).然后再按回来,应用程序将退出.

我想要的是当我回到片段A(最后一个片段)并点击返回时,应用程序将立即退出,而不是空白的白色屏幕

我搜索了SO并发现了一个类似的问题,但还没有答案,所以我不得不提出另一个问题

我怎样才能做到这一点?非常感谢你

android android-fragments navigation-drawer

10
推荐指数
3
解决办法
1万
查看次数

如何将 create-react-app 部署到 Google Cloud

我有一个前端 create-react-app 和一个使用 Expressjs 的后端 API。

我成功地将后端 API 部署到了 Google App Engine。

但是现在我需要将 create-react-app 部署到 Google Cloud 并且变得非常混乱,我尝试了一段时间的 google 并且没有正确/推荐的方法。

至少我看到其他人建议以两种方式进行:

  1. 使用谷歌云存储:

    • 运行“npm run build”来创建“build”文件夹

    • 将整个文件夹上传到存储桶中

=> 我发现使用这种方式有一个缺点:当我尝试重新加载页面 'url/aboutUs' 时,它没有找到。所以我必须回到“url”然后点击关于我们链接

=> 我猜我使用的 React Router 不能与 Google Cloud Storage 配合使用

  1. 使用 Google 应用引擎

=> 人们刚刚谈到使用它,但我找不到任何指南/教程。

那么将 create-react-app 部署到 Google Cloud 的推荐方法是什么?

你能提供一个教程吗?

谢谢。

google-app-engine google-cloud-storage reactjs google-cloud-platform create-react-app

7
推荐指数
1
解决办法
5752
查看次数

在网站构建器中处理自定义域?

我正在尝试构建一个网站构建器(它将在开始时生成静态网站)。

当我需要允许客户使用自己的域时,我不知道如何处理这种情况。

我进行了一次头脑风暴,这是我的想法:

  1. 将他们的静态网站(HTML、CSS、JavaScript)生成到我服务器上的文件夹中

  2. 当客户在我的网站构建器工具中输入域名时 => 告诉他们将域名指向我的服务器 IP 地址

  3. 然后编写一个命令来自动为每个域生成虚拟主机/服务器块,并指向静态文件(HTML、CSS、JavaScript)的位置

我认为这种做法在某种程度上是相当不正确的。

您能告诉我像 Shopify 这样的网站建设者是用什么方法做到这一点的吗?

subdomain dns server

5
推荐指数
0
解决办法
317
查看次数

MongoDB 更改流事件:替换与更新?

我检查了文档https://docs.mongodb.com/manual/reference/change-events/

我不确定事件“替换”和“更新”究竟何时发生。

例如,当我使用 MongoDB Compass 更改文档的 1 个字段时,我预计会触发事件“update”,但当我记录该事件时,它是“replace”。

因此,如果预期的更新实际上是“替换”事件,那么真正的“更新”事件何时会触发?

谢谢。

mongodb changestream

4
推荐指数
1
解决办法
2294
查看次数

如何从ArrayAdapter中的onClickListener重新加载活动

我正在处理一个包含列表视图的片段(此片段是在创建活动时生成的PlaceHolderFragment)。我扩展了ArrayAdapter来制作我的自定义适配器,并用该适配器填充我的列表视图。

重要的一件事是在列表视图的一行中,有2个按钮:第一个是启用/禁用按钮,用于更改用户的状态(当用户的状态为活动时,则禁用,否则为启用),第二个是删除按钮(用于删除用户)。所以我必须在适配器的方法getView()中为这2个按钮实现OnClickListener

单击任一按钮时,它将向服务器发送请求并操纵数据库(更改用户状态或从数据库中删除用户)。事情是当我单击启用按钮(例如)时,成功并且数据库中的用户状态发生了更改;或者当我单击删除按钮时,用户将成功从数据库中删除

但是,单击该按钮后,它的状态不会更改(我的意思是如果启用了用户,那么现在该按钮必须更改为禁用,或者如果删除了用户,则必须从屏幕上删除该行)。我必须手动重新加载此片段(切换到其他片段然后再回来)

问题是如何重新加载活动(我已经实现了onResume来将所有数据加载到适配器,所以如果我可以让此方法运行片段的onResume,它将按我的预期工作),或者至少如何将listview重新加载到更新新数据?

注意:notifyDataSetChanged()无效,因为适配器中的数据实际上尚未更改,仅服务器上的数据已更改

注意2:如果您需要我发布代码,请发表评论,因为我的代码很长,所以我将编辑我的帖子。

感谢你并致以真诚的问候!

编辑1 我已经在下面的答案中发布了我的解决方案,它解决了这个问题,但是我不得不说这是android中非常糟糕的做法。例如,当您想用这种方法删除一个项目时,您可能想放置一个AlertDialog供用户确认,但是AlertDialog只能在Activity(或Fragment)中显示,而不能从Adapter中显示。因此,您应该使用一些其他方法,例如ContextMenu或CustomDialog。

android listview android-arrayadapter onclicklistener

3
推荐指数
1
解决办法
6357
查看次数

react-konva 如何在上传后更改图像?

我正在做一个小项目,允许用户上传图像,然后图像将显示在画布上。

为此,我正在使用react-konva

我有一个名为 DesignPage 的容器组件,它管理状态并将事件处理程序传递给它的子级。

在这个 DesignPage 组件中,我还有 2 个其他组件:工具 - 画布

当我使用Tools组件上传图像时,图像应该显示在Canvas组件上。

我在Tools组件中使用react-dropzone来处理文件上传

在这个Canvas组件里面,有一个叫做DesignImage的子组件,它只是用来显示图片的。

但问题是,当我上传时,它不会改变画布上的图像。

我该如何解决?

这是我的代码:

设计页面组件:

import React, {Component} from 'react';
import {
    Row,
    Col
} from 'reactstrap';

import Tools from "../components/DesignPage/Tools";
import Canvas from "../components/DesignPage/Canvas";
import Styles from "../components/DesignPage/Styles";

class DesignPage extends Component {

    state = {
        text: '',
        image: '',
        files: []
    };

    static …
Run Code Online (Sandbox Code Playgroud)

html5-canvas reactjs konvajs

2
推荐指数
1
解决办法
2457
查看次数

react-konva 如何将舞台宽度和高度设置为等于其容器?

我想将舞台的宽度和高度设置为等于它的 div 容器,在我的例子中,它是 className 为“drawing-area”的 div

const Canvas = props => {
    return <Row>
        <Col xs={12} className="canvas-container">
            <div className="drawing-area">
                <Stage width={450} height={200}>
                    <Layer>
                        <BoxSurface/>
                        <UserText text={props.text}/>
                        <DesignImage image={props.image}/>
                        <Handler image={props.image}/>
                    </Layer>
                </Stage>
            </div>
        </Col>
    </Row>;
};
Run Code Online (Sandbox Code Playgroud)

因为当我像上面一样设置宽度和高度固定时,当屏幕尺寸改变时,布局会被破坏。

非常感谢。

html5-canvas reactjs konvajs

1
推荐指数
1
解决办法
7210
查看次数

为什么fflush(stdin)不会删除缓冲区(stdin)

我有这样的测试代码

#include <stdio.h>
#include <stdlib.h>
#include <string.h>

int main() {
    char c, str[20];
    printf("Enter a character : ");
    scanf("%c", &c);
    printf("Enter a string : ");
    fflush(stdin);
    gets(str);
    printf("\n\n\nResult : %c\n%s\n", c, str);
    return 0;
}
Run Code Online (Sandbox Code Playgroud)

我读过一些文章说这段代码会起作用,因为在扫描c字符后,缓冲区中仍然有'\n'字符.fflush(stdin)将清除缓冲区,因此gets()函数可以正常工作

但事实上,当我在Mac OS环境中编译并运行此代码时,fflush(stdin)什么都不做.我输入了一个字符(例如,'k'),然后它打印了k字符和'\n'字符.它假设允许我输入一个字符,一个字符串,然后打印它们.谁知道为什么?谢谢!

c macos

-1
推荐指数
1
解决办法
1900
查看次数