149 lines
No EOL
5.1 KiB
Markdown
149 lines
No EOL
5.1 KiB
Markdown
# 导航
|
||
|
||
一组用于处理查询参数对象、序列化查询参数、更新查询参数和触发路径更改的导航相关函数。
|
||
|
||
## 安装
|
||
|
||
安装模块
|
||
|
||
```bash
|
||
pnpm install @woocommerce/navigation --save
|
||
```
|
||
|
||
## 用法
|
||
|
||
### getHistory
|
||
|
||
一个用于执行路径更改的单一历史对象。需要将其传递给 ReactRouter 才能使用此库中的其他路径函数。
|
||
|
||
```jsx
|
||
import { getHistory } from '@woocommerce/navigation';
|
||
|
||
render() {
|
||
return (
|
||
<Router history={ getHistory() }>
|
||
…
|
||
</Router>
|
||
);
|
||
}
|
||
```
|
||
|
||
### getPath() ⇒ <code>String</code>
|
||
从历史中获取当前路径。
|
||
|
||
**返回**: <code>String</code> - 当前路径。
|
||
|
||
### getTimeRelatedQuery(query) ⇒ <code>Object</code>
|
||
从查询中获取时间相关参数。
|
||
|
||
**返回**: <code>Object</code> - 包含时间相关查询的对象。
|
||
|
||
| 参数 | 类型 | 描述 |
|
||
| --- | --- | --- |
|
||
| query | <code>Object</code> | 包含参数的查询。 |
|
||
|
||
### getIdsFromQuery(queryString) ⇒ <code>Array</code>
|
||
从逗号分隔的查询参数中获取 ID 数组。
|
||
|
||
**返回**: <code>Array</code> - 转换为唯一整数数组的 ID 列表。
|
||
|
||
| 参数 | 类型 | 描述 |
|
||
| --- | --- | --- |
|
||
| queryString | <code>string</code> | 从 URL 中提取的字符串值。 |
|
||
|
||
### getNewPath(query, path, currentQuery) ⇒ <code>String</code>
|
||
返回一个设置了查询参数的网址。
|
||
|
||
**返回**: <code>字符串</code> - 将查询参数合并到现有参数后的已更新网址。
|
||
|
||
| 参数 | 类型 | 描述 |
|
||
| --- | --- | --- |
|
||
| query | <code>Object</code> | 待更新的参数对象。 |
|
||
| path | <code>String</code> | 相对路径（默认为当前路径）。 |
|
||
| currentQuery | <code>Object</code> | 当前查询参数对象（默认为当前查询字符串）。 |
|
||
|
||
### getQuery() ⇒ <code>Object</code>
|
||
获取当前查询字符串，从历史记录中解析为对象。
|
||
|
||
**返回**: <code>Object</code> - 当前查询对象，默认为空对象。
|
||
|
||
### onQueryChange(param, path, query) ⇒ <code>function</code>
|
||
此函数返回给定 `param` 的事件句柄。
|
||
|
||
**返回**: <code>function</code> - 一个回调函数，调用时将 `param` 更新为通过的值。
|
||
|
||
| 参数 | 类型 | 描述 |
|
||
| --- | --- | --- |
|
||
| param | <code>string</code> | 应更新的查询字符串中的参数（例如 `page`、`per_page`） |
|
||
| path | <code>string</code> | 相对路径（默认为当前路径）。 |
|
||
| query | <code>string</code> | 当前查询参数的对象（默认为当前查询字符串）。 |
|
||
|
||
### updateQueryString(query, path, currentQuery)
|
||
更新当前页面的查询参数。
|
||
|
||
| 参数 | 类型 | 描述 |
|
||
| --- | --- | --- |
|
||
| query | <code>Object</code> | 待更新的参数字典。 |
|
||
| path | <code>String</code> | 相对路径（默认为当前路径）。 |
|
||
| currentQuery | <code>Object</code> | 当前查询参数字典（默认为当前查询字符串）。 |
|
||
|
||
### flattenFilters(filters) ⇒ <code>Array</code>
|
||
将包含子筛选器的筛选器值数组折叠成一个一维数组。
|
||
|
||
**返回**: <code>Array</code> - 所有筛选器的扁平化数组。
|
||
|
||
| 参数 | 类型 | 描述 |
|
||
| --- | --- | --- |
|
||
| filters | <code>Array</code> | 可能包含子筛选器的筛选器集合。 |
|
||
|
||
### getActiveFiltersFromQuery(query, config) ⇒ <code>Array.<activeFilters></code>
|
||
给定一个查询对象，返回一个 activeFilters 数组（如果存在）。
|
||
|
||
**返回**: <code>Array.<activeFilters></code> - - activeFilters 数组
|
||
|
||
| 参数 | 类型 | 描述 |
|
||
| --- | --- | --- |
|
||
| query | <code>object</code> | 查询对象 |
|
||
| config | <code>object</code> | 配置对象 |
|
||
|
||
### getDefaultOptionValue(config, options) ⇒ <code>string</code> \| <code>undefined</code>
|
||
从配置对象中获取给定过滤器的默认选项值。如果未提供 <code>defaultOption</code>，则使用第一个选项作为默认值。
|
||
|
||
**返回**: <code>string</code> \| <code>undefined</code> - - 默认选项的值。
|
||
|
||
| 参数 | 类型 | 描述 |
|
||
| --- | --- | --- |
|
||
| config | <code>object</code> | 过滤器配置对象。 |
|
||
| options | <code>array</code> | 选择选项。 |
|
||
|
||
### getQueryFromActiveFilters(activeFilters, query, config) ⇒ <code>object</code>
|
||
根据 activeFilters，创建一个新的查询对象以更新网址。使用 previousFilters 来移除未使用的参数。
|
||
|
||
**返回**: <code>object</code> - - 表示新参数的查询对象
|
||
|
||
| 参数 | 类型 | 描述 |
|
||
| --- | --- | --- |
|
||
| activeFilters | <code>Array.<activeFilters></code> | 在 UI 中显示的启用筛选 |
|
||
| query | <code>object</code> | 当前网址查询对象 |
|
||
| config | <code>object</code> | 配置对象 |
|
||
|
||
### getUrlKey(key, rule) ⇒ <code>string</code>
|
||
从过滤关键字和规则中获取网址查询关键字。
|
||
|
||
**返回**: <code>string</code> - - 网址查询关键字。
|
||
|
||
| 参数 | 类型 | 描述 |
|
||
| --- | --- | --- |
|
||
| key | <code>string</code> | 过滤关键字。 |
|
||
| rule | <code>string</code> | 过滤规则。 |
|
||
|
||
### activeFilter : <code>Object</code>
|
||
描述 activeFilter 对象。
|
||
|
||
**属性**
|
||
|
||
| 名称 | 类型 | 描述 |
|
||
| --- | --- | --- |
|
||
| key | <code>string</code> | 过滤关键字。 |
|
||
| [rule] | <code>string</code> | 过滤器的修改规则，例如 'includes' 或 'is_not'。 |
|
||
| value | <code>string</code> | 过滤值。 | |
