### 💬 Foreword Think about the experience of a React developer developing Vue. At the beginning of today tears to write more than a `vue` project, not turn, is to write more! The selection is vue3+vite development. `Composition API` gets me right into my element. react16 was selected for react development before. `ahooks` are the most `hooks` library I have access to, which fits my business very well. In the use of vue3 when the development time selected `vueuse`. ### 👨‍🏫 The question Front-end development deals with requests the most. Most businesses are restful api architectures where we get the data to work with, and the current popular frameworks have state mechanisms to rerequest when dependencies change, etc. 'useFetch' and `useAxios` in `vueuse` are' hooks' as requests. useFetch is relatively simple, with only some basic functions of the request body. `useAxios` more based on the built-in functions of axios encapsulation, business dependency refresh, anti-buffeting, throttling, caching and other functions are not. Here is a small partner asked, then you in `useAxios`package these throttling anti-shaking function is good, not to mention the need for intrusive modification of the hook, it only support`axios`, in case the project becomes` request`? ### 🙋‍♂️ solved ahooks are famous react hooks in the front end, which contain richer functions and can fit more of our business. useRequest can meet my needs, but there is no vue version. So I decided to develop a version of 'useRequest' based on vue3 features. It does everything ahooks do: - Automatic request/manual request - Polling - Anti-shake - throttling - Screen focus rerequest - Error retry - loading delay - SWR(stale-while-revalidate) - Cache - Plug-in ```typescript const { loading: Ref, The data? : Ref, The error? : Ref, Params: Ref < TParams | | > []. run: (...) params: TParams) => void, runAsync: (... params: TParams) => Promise, refresh: () => void, refreshAsync: () => Promise, RefreshAsync: () => Promise< tdata >, mutate: (data? : TData | ((oldData? : TData) => (TData | undefined))) => void, cancel: () => void; } = useRequest( service: (...) args: TParams) => Promise, { Manual? : boolean, DefaultParams? : TParams, OnBefore? : (params: TParams) => void, OnSuccess? : (data: TData, params: TParams) => void, OnError? : (e: Error, params: TParams) => void, OnFinally? : (params: TParams, data? : TData, e? : Error) => void, ... Advanced features, see the documentation for more } ); ``` This `useRequest` request body allows any promise object to be passed in, so it is not limited to `axios` or `request`, and the functionality is consistent. If we want to use some specific functionality of the request library, we can encapsulate those specific functionality into a plug-in called `useRequest` that can be controlled throughout its lifecycle. So it reflects both inclusiveness and acceptance of the specific functions of a single individual. * The use of plug-ins * ```typescript ``` The above implements a formatter return plug-in that overwrites the result of the request when the request is completed with a 'return {name: 'plugins update',age: 20,}'. See the documentation for more details. Here is my `Vue3` hooks library `vue-hooks-plus` based on `ahooks`, perfect test cases, high quality and reliable, gained a lot, the framework mechanism reflects the uniqueness of 🤩. In the future, I will share with you the principles in detail. ### 👋 Try it [document](https://inhiblabcore.github.io/docs/hooks) [github] (https://github.com//InhiblabCore/vue-hooks-plus) 🌟🌟, thank you for your support! ![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zpajnkwon1oe6cpmsapp.png) ![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/sjlsnkeudxptjqfpfran.png)

yonggit

Why did I choose to build wheels instead of VueUse?

Join Our Newsletter. No Spam, Only the good stuff.