# solid-request

> solid-js use-request hooks library

Latest version **1.2.0** (published 2023-05-16) · MIT license · 0 weekly downloads

## Install

```sh
npm install solid-request
pnpm add solid-request
yarn add solid-request
bun add solid-request
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.2.0 |
| Published | 2023-05-16 |
| First published | 2023-03-20 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 126.4 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 4 |
| Author | NelsonYong |
| Maintainers | yongjie |
| Keywords | solid-request, solid-hook, solid-use-request, solidjs-use-request, ahooks-solid  |

## Links

- npm: https://www.npmjs.com/package/solid-request
- Repository: https://github.com/NelsonYong/solid-request
- Issues: https://github.com/NelsonYong/solid-request/issues
- npm.io page: https://npm.io/package/solid-request

## Dependencies (1)

- [lodash](https://npm.io/package/lodash.md) ^4.17.21

## Alternatives

- [@sindresorhus/slugify](https://npm.io/package/@sindresorhus/slugify.md) — 3.7M weekly downloads
- [solid-js](https://npm.io/package/solid-js.md) — 2.7M weekly downloads
- [expo-glass-effect](https://npm.io/package/expo-glass-effect.md) — 2.5M weekly downloads
- [nanoassert](https://npm.io/package/nanoassert.md) — 780.8K weekly downloads
- [@ffmpeg/ffmpeg](https://npm.io/package/@ffmpeg/ffmpeg.md) — 529.5K weekly downloads

## Recent versions

- 1.2.0 (latest) — 2023-05-16
- 1.1.8 — 2023-03-24
- 1.1.7 — 2023-03-21
- 1.1.6 — 2023-03-21
- 1.1.5 — 2023-03-21
- 1.1.4 — 2023-03-21
- 1.1.3 — 2023-03-21
- 1.1.2 — 2023-03-21
- 1.1.0 — 2023-03-21
- 1.0.0 — 2023-03-20

## README

# Solid-request

With a strong ability to manage network requests, Hook has a flying experience

<br />

## Usage

### Install

```bash
npm i solid-request
```

### Import

```typescript
import useRequest from "solid-request"
```



`useRequest` Through the plug-in organization code, the core code is easy to understand, and can be easily expanded to more advanced functions. Capacity is now available to include

- Automatic/manual request
- Support Typescript
- Polling
- Debounce
- Throttle
- Refresh on window focus
- Error retry
- Loading delay
- SWR(stale-while-revalidate)
- Caching
- Plugins

## Default request

By default, the first parameter of `useRequest` is an asynchronous function, which is automatically executed when the component is initialized. At the same time, it automatically manages the status of `loading`, `data`, `error` of the asynchronous function.

```js
const { data, error, loading } = useRequest(service)
```

## example

```jsx
export async function getList({ id }: { id: number }): Promise<{
	id: number
	title: string
	body: string
	userId: number
}> {
	console.log(id)

	return fetch(`https://jsonplaceholder.typicode.com/posts/${id}`).then(
		(response) => response.json()
	)
}

function App() {
	const [count, setCount] = createSignal(1)
  
	const { data, loading } = useRequest(() => getList({ id: count() }), {
		manual: false,
		ready: true,
		refreshDeps: true,
		loadingDelay: 300,
	})

	return (
		<div>
			<button type="button" onClick={increment}>
				{count()}
			</button>
			<div>{loading() ? 'loading...' : JSON.stringify(data())}</div>
		</div>
	)
}
```



The document is under development, for more APIs, please see the vue version of  [useRequest](https://inhiblabcore.github.io/docs/hooks/en/useRequest/)

## Result

| Property     | Description                                                  | Type                                                         |
| ------------ | ------------------------------------------------------------ | ------------------------------------------------------------ |
| data         | Data returned by service                                     | `Accessor<TData \| undefined>`  `                             |
| error        | Exception thrown by service                                  | `Accessor<Error>` \| `undefined`                             |
| loading      | Is the service being executed                                | `Accessor<boolean>`                                          |
| params       | An array of parameters for the service being executed. For example, you triggered `run(1, 2, 3)`, then params is equal to `[1, 2, 3]` | `Accessor<TParams \| []>`                                    |
| run          | <ul><li> Manually trigger the execution of the service, and the parameters will be passed to the service</li><li>Automatic handling of exceptions, feedback through `onError`</li></ul> | `(...params: TParams) => void`                               |
| runAsync     | The usage is the same as `run`, but it returns a Promise, so you need to handle the exception yourself. | `(...params: TParams) => Promise<TData>`                     |
| refresh      | Use the last params, call `run` again                        | `() => void`                                                 |
| refreshAsync | Use the last params, call `runAsync` again                   | `() => Promise<TData>`                                       |
| mutate       | Mutate `data` directly                                       | `(data?: TData / ((oldData?: TData) => (TData / undefined))) => void` |
| cancel       | Ignore the current promise response                          | `() => void`                                                 |

## Options

| Property      | Description                                                  | Type                                                 | Default |
| ------------- | ------------------------------------------------------------ | ---------------------------------------------------- | ------- |
| initialData   | Init data                                                    | `TData` \| `undefined`                               |         |
| manual        | <ul><li> The default is `false`. That is, the service is automatically executed during initialization.</li><li>If set to `true`, you need to manually call `run` or `runAsync` to trigger execution. </li></ul> | `boolean`                                            | `false` |
| defaultParams | The parameters passed to the service at the first default execution | `TParams`                                            | -       |
| formatResult  | Format the request results, which recommend to use `useFormatResult` | `(response: TData) => any`                           | -       |
| onBefore      | Triggered before service execution                           | `(params: TParams) => void`                          | -       |
| onSuccess     | Triggered when service resolve                               | `(data: TData, params: TParams) => void`             | -       |
| onError       | Triggered when service reject                                | `(e: Error, params: TParams) => void`                | -       |
| onFinally     | Triggered when service execution is complete                 | `(params: TParams, data?: TData, e?: Error) => void` | -       |

---
_Source: https://npm.io/package/solid-request · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._