小编DeV*_*olt的帖子

我想知道，在故事书中模拟 React 状态的“最佳实践”是什么（例如 *.stories.js）。

目前我正在尝试实现深色主题切换。

1. App Component 有一个名为“darkState”的状态，可以设置 true/false
2. 应用程序组件有一个处理程序“handleThemeChange()”，它根据“darkState”更改 MUI 主题
3. 标题组件有一个带有“onChange()”的开关或按钮，它会触发应用程序组件中的“handleThemeChange()”
4. MUI Switch 需要一个状态才能正常工作（至少我猜是这样）

所以，我决定在我的故事文件中模拟这个状态。但是在装饰器中写这个似乎......很奇怪。你怎么解决这个问题？

/components/Header/Header.stories.js

import React, { useState } from "react";
import { Header } from "./Header";

export default {
  title: "Components/Header",
  component: Header,
  decorators: [
    (StoryFn) => {
      // mock state
      const [darkState, setDarkState] = useState(false);
      const handleThemeChange = () => {
        setDarkState(!darkState);
        return darkState;
      };

      return (
        <Header
          enableThemeChange={true}
          handleThemeChange={handleThemeChange}
          darkState={darkState}
        />
      );
    }
  ]
};

const Template = (args) => <Header {...args} />; …

我的问题基于以下示例：https : //git-scm.com/book/en/v2/Git-Branching-Basic-Branching-and-Merging

举个例子：

1. 在提交C2中设置变量= 2，然后在C4中更改为变量= 4，然后在C5中更改为变量= 2
2. 制作一个git merge master <branch of iss53>，导致Merge made by the 'recursive' strategy.
3. 变量是4。

但为什么？

我预期：由于祖先将变量设置为2，而commit（iss53）也将变量设置为2，因此合并后的结果应为2。因为公共祖先和最新版本的变量设置为2

这种行为取决于合并策略吗？

编辑：我忘了提及，我在C3中更改了变量= 3。但是结果是一样的。

我尝试通过 docker-compose 启动一些服务。其中之一是nginx 反向代理，处理不同的路径。一种路径（“/react”）是到一个容器化的react_app，在端口80上有一个nginx。唯一的，反向代理工作正常。另外，如果我在端口 80 上为react_app 的 nginx 提供服务，那么一切工作都很好。在不更改配置中任何内容的情况下将两者结合起来会导致 css 和 js 等静态文件出现 404 错误。

设置 #1
正确转发路径 /test 到 Google。

docker-compose.yml

version: "3"

services:
  #react_app:
  #  container_name: react_app
  #  image: react_image
  #  build: .
  reverse-proxy:
    image: nginx:latest
    container_name: reverse-proxy
    volumes:
      - ./nginx.conf:/etc/nginx/nginx.conf
    ports:
      - '80:80'

nginx.conf（反向代理）

location /test {
    proxy_pass http://www.google.com/;
}

设置 #2
无反向代理。来自容器react_app 内的nginx 的正确答案。

docker-compose.yml

version: "3"

services:
  react_app:
    container_name: react_app
    image: react_image
    build: .
  #reverse-proxy:
  #  image: nginx:latest …