小编Mat*_*ong的帖子

目前，这样做setSearchParams(/* an object */)将替换现有的搜索参数。如果我想扩展搜索参数而不是替换它们，例如添加新参数。实现这一目标的最优雅的方式是什么？

我知道我可以直接修改searchParams，然后做类似的事情setSearchParams(newSearchParamsToObject)。然而，sincesearchParams不是一个对象，而是一个URLSearchParams。代码会又长又难看。

编辑：因为有人似乎不明白我发布的内容

目前，如果我们这样做：

const [searchParams, setSearchParams] = useSearchParams({ a: 1 });
setSearchParams({ b: 2 });

它将替换searchParams为?b=2.

我想要实现的是添加b=2到现有的搜索参数，即最终的搜索参数应该是?a=1&b=2.

我正在使用material-ui@v5，即。阿尔法分支。

目前，我有一个自定义Timeline组件可以执行以下操作：

const CustomTimeline = () => {
  const mdDown = useMediaQuery(theme => theme.breakpoints.down("md"));

  return (
    <Timeline position={mdDown ? "right" : "alternate"}>
      {/* some children */}
    </Timeline>
  );
};

它基本上按预期工作，但移动用户可能会遇到布局变化，因为它useMediaQuery是使用 JS 实现的并且仅在客户端。我想寻求与上述代码等效的 CSS 实现，以便与 SSR 一起使用。

我想到了以下几点：

const CustomTimeline = () => {

  return (
    <Fragment>
      <Timeline sx={{ display: { xs: "block", md: "none" } }} position="right">
        {/* some children */}
      </Timeline>
      <Timeline sx={{ display: { xs: "none", md: "block" } }} position="alternate">
        {/* …

我正在使用 MUI v5 和 Gatsby Image。我希望在整个应用程序中保持样式语法的一致性，因此我尝试将sxprop 添加到GatsbyImage.

这是我尝试过的：

<Box
  component={GatsbyImage}
  sx={/* my sx styles */}
/>

这就是我想要的。然而，我注意到该sxprop 以某种方式传递给了img. 这最终会<img sx=[object Object]/>在我的 HTML 中得到 a 。

虽然这并不会真正影响我的应用程序，但我想知道是否有更好的方法来实现这一目标？

所以我有一个应用程序，允许用户在浅色和深色模式之间切换。我想background_color在用户切换主题模式时进行相应的设置。

对于theme_color，我可以动态设置元标记并将占位符值放入manifest.json. 但据我所知，没有元数据background_color