小编Tai*_*o.1的帖子

React Router:在没有上下文的情况下单独使用 <Outlet /> 的目的是什么?

据我现在的理解,如果我们传递一个Outletwith 上下文,上下文之后的 props 可以传递到 child 中,而outlet 充当模板,将这些 props 传递到路由器可能渲染的任何子代中。

我的问题是,如果我们只是<Outlet />在没有上下文的情况下设置怎么办?如果它没有通过任何props,我们有什么理由特别想<Outlet />单独使用呢?

代码可能如下所示

索引.js

root.render(
  <BrowserRouter>
    <Routes>
      <Route path="/" element={<App />}>
        <Route path="checkout" element={<Checkout />} />
      </Route>
    </Routes>
  </BrowserRouter>
);
Run Code Online (Sandbox Code Playgroud)

应用程序.js

function App() {
  return (
    <>
      <Reset />
      <GlobalStyle />
      <Header cartItems={cartItems} />
      <Outlet />
    </>
  )
}
Run Code Online (Sandbox Code Playgroud)

reactjs react-router react-router-dom

10
推荐指数
2
解决办法
4万
查看次数

React工具包查询-如何在同一功能组件中使用多个查询

您好,我一直坚持使用 RTK 查询在一个功能组件中获取多个数据。如果您知道出路,请帮忙。多谢。

我的目标 我想通过 RTK 查询获取两个 api,都使用“GET”方法,基本 url 是相同的,唯一的区别是查询字符串。

我的问题是, 如果我只在函数组件中设置一个查询,则无法更改查询字符串,因为它将更改我从获取的数据中呈现的数据。

由于新的数据集为原始数据提供了信息。我不能将组件分成两部分。

我尝试 在 RTK 代码中的原始查询下方设置另一个查询,如下所示。

export const createIssueApi = createApi({
  reducerPath: "createLabelApi",
  baseQuery: fetchBaseQuery({
    baseUrl: "https://api.github.com/repos",
  }),
  tagTypes: ["issues"],
  endpoints: (builder) => ({

...... original query above, new query I set below
getClosedIssues: builder.query<GetLebal[], Parameter>({
      query: ({ type, name, repo, query }) => ({
        url: `/${name}/${repo}/${type}${query}`,
        method: "GET",
        headers: new Headers({
          "Content-Type": "application/json",
          Authorization: `token ${process.env.REACT_APP_PASSWORD}`,
        }),
      }),
      providesTags: ["issues"],
    }),
  }),
});
Run Code Online (Sandbox Code Playgroud)

然后我尝试在同一组件中使用此查询来获取 2 个 api,如下所示

 const …
Run Code Online (Sandbox Code Playgroud)

reactjs react-hooks redux-toolkit

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