28個SpringBoot項目中常用注解，日常開發、求職面試不再懵圈
前言在使用SpringBoot開發中或者在求職面試中都會使用到很多注解或者問到注解相關的知識。本文主要對一些常用的注解進行了總結，同時也會舉出具體例子，供大家學習和參考。注解
最近因為工作的關系，開始接觸 React Query[1]。不用不知道，一用真好用！
React Query 是以前的叫法，現在叫 TanStack Query。之所以改名字，是因為這個團隊發現，他們可以把這套方案推廣到除 React 之外的其他框架中去。
圖片
如圖所示，目前（2024.06）最新的 v5 版本已經支持包含 React、Vue、Angular 在內的 5 大框架了。
那 React Query 到底是做什么的呢？
籠統地說，React Query 是用來管理接口請求的，包括增刪改查所有類型的接口。管理的內容包括響應數據和請求狀態，可以讓你少些很多樣板代碼。
另外，一旦學會了 React Query 的使用，那么在其他框架中的應用也是一樣，上手就快了。
不過 React Query 學習成本也高，要徹底熟練 React Query 的使用，就要學習很多概念，不過理解這些概念對于我們寫出交互友好的頁面又極其關鍵。
于是，我便萌生了寫一個 React Query 系列文章的想法。本文就是第一篇，大概談論它是做什么的，如何使用，有什么能力，后面再一篇一個具體話題單獨討論。
React Query 是從 v3 版本改名字的：
新舊版本改動不多[2]，因為我現在用的是舊包，我就那它舉例了。
先創建一個 React 項目。
npm create vite@latest react-query-demos -- --template reactcd react-query-demos安裝 react-query[3] 依賴，啟動項目。
npm install react-querynpm installnpm run dev接下來刪除 index.css 中的內容，再修改 App.jsx，注入 React Query 上下文依賴。
import { QueryClient, QueryClientProvider, useQuery } from 'react-query'const queryClient = new QueryClient()export default function App() { return ( <QueryClientProvider client={queryClient}> {/* ... */} </QueryClientProvider> )}這一步是必須的，后續 React Query 的接口查詢和修改等 API 能力都有賴于 queryClient。
說了那么多，我們直接上一個 React Query 案例直觀感受一下它的使用。
我們創建一個 <Example /> 組件，內容如下：
import { useQuery } from 'react-query'function Example() { // 1) const { isLoading, isError, error, data } = useQuery('repoData', () => fetch('https://api.github.com/repos/tannerlinsley/react-query').then(res => res.json() ) ) // 2) if (isLoading) return 'Loading...' if (isError) return 'An error has occurred: ' + error.message // 3) return ( <div> <h1>{data.name}</h1> <p>{data.description}</p> <strong>
本文鏈接：http://www.tebozhan.com/showinfo-26-93085-0.htmlReact Query 是做什么的？你知道嗎？
聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。郵件：2376512515@qq.com
上一篇： HTTP QUERY method，前端傳SQL不再是笑話
下一篇： ASP.NET Core 性能優化指南
Copyright ? 2016-2023 天津谷騏科技有限公司 版權所有 sitemap.xml
違法及侵權請聯系：2376512515@qq.com 津ICP備18001702號
津公網安備 12010102000574號