Skip to content

Commit

Permalink
Merge branch 'feature/alova@3.x'
Browse files Browse the repository at this point in the history
  • Loading branch information
@JOU-amjs
JOU-amjs committed Oct 12, 2024
2 parents 489a264 + 8d2f41c commit c82f6a5
Show file tree
Hide file tree
Showing 7 changed files with 81 additions and 34 deletions.
22 changes: 12 additions & 10 deletions docs/tutorial/03-client/01-strategy/04-use-pagination.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -614,8 +614,9 @@ When you do not want to update the list items locally after the data operation,
* If no page number is passed in, the current page will be refreshed
* If a list item is passed in, the page where the list item is located will be refreshed
* @param pageOrItemPage Refreshed page number or list item
* @returns [v3.1.0+]an promise that contains response data
*/
declare function refresh(pageOrItemPage?: number | LD[number]): void;
declare function refresh(pageOrItemPage?: number | LD[number]): Promise<AG['Responded']>;
```

In append mode, you can specify the parameter of `refresh` as a list item. When the same reference of this list item is found, the data of the page number where this list item is located will be refreshed.
Expand All @@ -638,8 +639,9 @@ It will clear all caches and reload the first page.
```typescript
/**
* Reload the list from the first page and clear the cache
* @returns [v3.1.0+]an promise instance that indicate if the reset is successful
*/
declare function reload(): void;
declare function reload(): Primise<void>;
```

## Compatible with `updateState`
Expand Down Expand Up @@ -705,14 +707,14 @@ Inherit all responsive data from [**useWatcher**](/api/core-hooks#usewatcher).

Inherit all action functions of [**useWatcher**](/api/core-hooks#usewatcher).

| name | description | function parameters | return value | version |
| ------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------ | ------- |
| refresh | Refresh the data of the specified page number, this function will ignore the forced sending request of the cache, in the append mode, the list item can be passed in to indicate the page number where the list item is refreshed | pageOrItemPage: Refreshed page number or list item | - | - |
| insert | Insert a piece of data. If no index is passed in, it will be inserted at the front by default. If a list item is passed in, it will be inserted after the list item. If the list item is not in the list data, an error will be thrown | 1. item: insert item<br/>2. indexOrItem: insert position (index) or list item, default is 0 | - | - |
| remove | Remove a piece of data. When a number is passed in, it means the removed index. When the position is passed in a list item, the list item will be removed. If the list item is not in the list data, an error will be thrown | position : remove position (index) or list item | - | - |
| replace | Replace a piece of data. When the second parameter is passed in a number, it means the replacement index. A negative number means counting from the end. When the position passed in is a list item, the list item will be replaced. If the list item is not in the list data An error will be thrown | 1. item: replacement item<br/>2. position: replacement position (index) or list item, when a negative number is passed in, it means counting from the end | - | - |
| reload | Clear the data and re-request the first page of data | - | - | - |
| update | Update state data, same as alova's use hook, but update list data when updating data field | newFrontStates: new state data object | - | - |
| name | description | function parameters | return value | version |
| ------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------- | ------- |
| refresh | Refresh the data of the specified page number, this function will ignore the forced sending request of the cache, in the append mode, the list item can be passed in to indicate the page number where the list item is refreshed | pageOrItemPage: Refreshed page number or list item | Promise\<AG\['Responded'\]\> | v3.1.0+ |
| insert | Insert a piece of data. If no index is passed in, it will be inserted at the front by default. If a list item is passed in, it will be inserted after the list item. If the list item is not in the list data, an error will be thrown | 1. item: insert item<br/>2. indexOrItem: insert position (index) or list item, default is 0 | - | - |
| remove | Remove a piece of data. When a number is passed in, it means the removed index. When the position is passed in a list item, the list item will be removed. If the list item is not in the list data, an error will be thrown | position : remove position (index) or list item | - | - |
| replace | Replace a piece of data. When the second parameter is passed in a number, it means the replacement index. A negative number means counting from the end. When the position passed in is a list item, the list item will be replaced. If the list item is not in the list data An error will be thrown | 1. item: replacement item<br/>2. position: replacement position (index) or list item, when a negative number is passed in, it means counting from the end | - | - |
| reload | Clear the data and re-request the first page of data | - | Promise\<void\> | v3.1.0+ |
| update | Update state data, same as alova's use hook, but update list data when updating data field | newFrontStates: new state data object | - | - |

### Event

Expand Down
29 changes: 22 additions & 7 deletions docs/tutorial/03-client/01-strategy/08-action-delegation-middleware.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ import { actionDelegationMiddleware } from 'alova/client';

useRequest(queryTodo, {
//...
middleware: actionDelegationMiddleware('actionName')
middleware: actionDelegationMiddleware('testAction')
});
```

Expand All @@ -48,7 +48,7 @@ In any component (such as component B), pass in the specified delegate name thro
```javascript title=Component B
import { accessAction } from 'alova/client';

accessAction('actionName', delegatedActions => {
accessAction('testAction', delegatedActions => {
// Call the send function in component A
delegatedActions.send();

Expand All @@ -59,11 +59,26 @@ accessAction('actionName', delegatedActions => {

:::info note

1. All use hooks in alova support action function delegation, but the functions delegated by different use hooks are different.
2. When using `actionDelegationMiddleware`, the delegate name can be passed in strings, numbers, and symbol values.
1. The use hook that only makes request will have its actions delegated
2. All use hooks in alova support action function delegation, but the functions delegated by different use hooks are different.
3. When using `actionDelegationMiddleware`, the delegate name can be passed in strings, numbers, and symbol values.

:::

### Silently access actions

By default, an error will be throwed when the action delegate of `testAction` is not found, which can help you locate problems, but if you are not sure whether the target actions are delegated when calling `accessAction`, you can prevent the error by passing the third parameter `true`.

```javascript
accessAction(
'testAction',
delegatedActions => {
delegatedActions.send();
},
true
);
```

### Batch trigger action function

In the above example, we use `accessAction` to trigger the action function of a use hook, but in fact, delegates with the same name will not override each other, but will be stored in a group, and we can use this name to trigger them at the same time The delegated function.
Expand All @@ -73,7 +88,7 @@ import { actionDelegationMiddleware } from 'alova/client';

useRequest(queryTodo, {
//...
middleware: actionDelegationMiddleware('actionName1')
middleware: actionDelegationMiddleware('testAction1')
});
```

Expand All @@ -82,15 +97,15 @@ import { actionDelegationMiddleware } from 'alova/client';

useRequest(queryTodo, {
//...
middleware: actionDelegationMiddleware('actionName1')
middleware: actionDelegationMiddleware('testAction1')
});
```

```javascript title=Component E
import { accessAction } from 'alova/client';

// Because the delegate hooks of component C and component D will be matched, the callback function will be executed twice
accessAction('actionName1', delegatedActions => {
accessAction('testAction1', delegatedActions => {
// Call the send function in component C and component D
delegatedActions.send();

Expand Down
22 changes: 12 additions & 10 deletions ...plugin-content-docs/current/tutorial/03-client/01-strategy/04-use-pagination.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -614,8 +614,9 @@ declare function replace(
* 如果未传入页码则会刷新当前页
* 如果传入一个列表项，将会刷新此列表项所在页
* @param pageOrItemPage 刷新的页码或列表项
* @returns [v3.1.0+]包含响应数据的promise
*/
declare function refresh(pageOrItemPage?: number | LD[number]): void;
declare function refresh(pageOrItemPage?: number | LD[number]): Promise<AG['Responded']>;
```

在 append 模式下，你可以将`refresh`的参数指定为列表项，当查找到这个列表项的相同引用时，刷新此列表项所在页数的数据。
Expand All @@ -638,8 +639,9 @@ update({
```typescript
/**
* 从第一页开始重新加载列表，并清空缓存
* @returns [v3.1.0+]promise实例，表示是否重置成功
*/
declare function reload(): void;
declare function reload(): Promise<void>;
```

## 与`updateState`兼容使用
Expand Down Expand Up @@ -705,14 +707,14 @@ updateState<Item[]>(listMethod, {

继承[**useWatcher**](/api/core-hooks#usewatcher)所有操作函数。

| 名称 | 描述 | 函数参数 | 返回值 | 版本 |
| ------- | ------------------------------------------------------------------------------------------------------------------------------------------------------ | --------------------------------------------------------------------------------------- | ------ | ---- |
| refresh | 刷新指定页码数据，此函数将忽略缓存强制发送请求，append 模式下可传入列表项表示刷新此列表项所在的页数 | pageOrItemPage: 刷新的页码或列表项 | - | - |
| insert | 插入一条数据，如果未传入 index，将默认插入到最前面，如果传入一个列表项，将插入到这个列表项的后面，如果列表项未在列表数据中将会抛出错误 | 1. item: 插入项<br/>2. indexOrItem: 插入位置（索引）或列表项，默认为 0 | - | - |
| remove | 移除一条数据，当传入数字时表示移除的索引，当 position 传入的是列表项，将移除此列表项，如果列表项未在列表数据中将会抛出错误 | position: 移除位置（索引）或列表项 | - | - |
| replace | 替换一条数据，当第二个参数传入数字时表示替换索引，负数表示从末尾算起，当 position 传入的是列表项，将替换此列表项，如果列表项未在列表数据中将会抛出错误 | 1. item: 替换项<br/>2. position: 替换位置（索引）或列表项，传入负数时表示从末尾开始算起 | - | - |
| reload | 清空数据，并重新请求第一页数据 | - | - | - |
| update | 更新状态数据，与 alova 的 use hook 用法相同，但在更新 data 字段时是更新列表数据 | newFrontStates：新的状态数据对象 | - | - |
| 名称 | 描述 | 函数参数 | 返回值 | 版本 |
| ------- | ------------------------------------------------------------------------------------------------------------------------------------------------------ | --------------------------------------------------------------------------------------- | ---------------------------- | ------- |
| refresh | 刷新指定页码数据，此函数将忽略缓存强制发送请求，append 模式下可传入列表项表示刷新此列表项所在的页数 | pageOrItemPage: 刷新的页码或列表项 | Promise\<AG\['Responded'\]\> | v3.1.0+ |
| insert | 插入一条数据，如果未传入 index，将默认插入到最前面，如果传入一个列表项，将插入到这个列表项的后面，如果列表项未在列表数据中将会抛出错误 | 1. item: 插入项<br/>2. indexOrItem: 插入位置（索引）或列表项，默认为 0 | - | - |
| remove | 移除一条数据，当传入数字时表示移除的索引，当 position 传入的是列表项，将移除此列表项，如果列表项未在列表数据中将会抛出错误 | position: 移除位置（索引）或列表项 | - | - |
| replace | 替换一条数据，当第二个参数传入数字时表示替换索引，负数表示从末尾算起，当 position 传入的是列表项，将替换此列表项，如果列表项未在列表数据中将会抛出错误 | 1. item: 替换项<br/>2. position: 替换位置（索引）或列表项，传入负数时表示从末尾开始算起 | - | - |
| reload | 清空数据，并重新请求第一页数据 | - | Promise\<void\> | v3.1.0+ |
| update | 更新状态数据，与 alova 的 use hook 用法相同，但在更新 data 字段时是更新列表数据 | newFrontStates：新的状态数据对象 | - | - |

### 事件

Expand Down
Loading

0 comments on commit c82f6a5

Please sign in to comment.