# 结账商店 (`wc/store/checkout`)

> 💡 购物车商店和结账商店有什么区别？
>
> **购物车商店 (`wc/store/cart`)** 管理和检索关于购物车的的数据，包括商品、客户数据以及优惠券等交互。
>
> **结账商店 (`wc/store/checkout`)** 管理和检索与结账过程相关的数据，包括客户 ID、订单 ID 和结账状态。

## 概述

结账商店提供了一组选择器，用于访问和管理结账过程中的数据。 这些选择器使开发者能够获取关键信息，例如客户信息、订单状态和其他与结账相关的的数据。

## 使用方法

要使用此商店，您需要在任何引用它的模块中导入 `checkoutStore` `StoreDescriptor`。 假设 `@woocommerce/block-data` 已注册为指向 `wc.wcBlocksData` 的外部依赖，您可以通过以下方式导入 `StoreDescriptor`：

```js
const { checkoutStore } = '@woocommerce/block-data'
```

如果未注册，您可以通过以下方式导入：

```js
const { checkoutStore } = window.wc.wcBlocksData
```

## 选择器

### `getCustomerId`

返回正在由结账块处理的客户的 WordPress 用户 ID。

#### _返回值_ <!-- omit in toc -->

-   `number`: 客户的 WordPress 用户 ID。

#### _示例_ <!-- omit in toc -->

```js
const store = select( checkoutStore );
const customerId = store.getCustomerId();
```

### `getOrderId`

返回正在由结账块处理的订单的 WooCommerce 订单 ID。

#### _返回值_ <!-- omit in toc -->

-   `number`: WooCommerce 订单 ID。

#### _示例_ <!-- omit in toc -->

```js
const store = select( checkoutStore );
const orderId = store.getOrderId();
```

### `getOrderNotes`

返回订单备注。

#### _返回值_ <!-- omit in toc -->

-   `string`: 订单备注。

#### _示例_ <!-- omit in toc -->

```js
const store = select( checkoutStore );
const orderNotes = store.getOrderNotes();
```

### `getRedirectUrl`

返回结账完成后要重定向到的 URL。

#### _返回值_ <!-- omit in toc -->

-   `string`: 要重定向到的 URL。

#### _示例_ <!-- omit in toc -->

```js
const store = select( checkoutStore );
const redirectUrl = store.getRedirectUrl();
```

### `getExtensionData`

返回由扩展注册的额外数据。

#### _返回值_ <!-- omit in toc -->

-   `object`: 由扩展注册的额外数据。

```js
{
    [ extensionNamespace ]: {
        [ key ]: value,
    },
}
```

#### _示例_ <!-- omit in toc -->

```js
const store = select( checkoutStore );
const extensionData = store.getExtensionData();
```

### `getCheckoutStatus`

返回结账过程的当前状态。

#### _返回值_ <!-- omit in toc -->

-   `string`: 结账过程的当前状态。 可能的值包括：`pristine`、`before-processing`、`processing`、`after-processing`、`complete`、`idle`。

#### _示例_ <!-- omit in toc -->

```js
const store = select( checkoutStore );
const checkoutStatus = store.getCheckoutStatus();
```

### getShouldCreateAccount

如果用户选择在下单时创建账户，则返回 true。

#### _返回值_ <!-- omit in toc -->

-   `boolean`: 如果用户选择在下单时创建账户，则返回 true。

#### _示例_ <!-- omit in toc -->

```js
const store = select( checkoutStore );
const shouldCreateAccount = store.getShouldCreateAccount();
```

### getUseShippingAsBilling

如果用户选择将收货地址作为账单地址，则返回 true。

#### _返回值_ <!-- omit in toc -->

-   `boolean`: 如果应该将收货地址用作账单地址，则返回 true。

#### _示例_ <!-- omit in toc -->

```js
const store = select( checkoutStore );
const useShippingAsBilling = store.getUseShippingAsBilling();
```

### getEditingBillingAddress

如果正在编辑账单地址，则返回 true。

#### _返回值_ <!-- omit in toc -->

-   `boolean`: 如果正在编辑账单地址，则返回 true。

#### _示例_ <!-- omit in toc -->

```js
const store = select( checkoutStore );
const editingBillingAddress = store.getEditingBillingAddress();
```

### getEditingShippingAddress

如果正在编辑收货地址，则返回 true。

#### _返回值_ <!-- omit in toc -->

-   `boolean`: 如果正在编辑收货地址，则返回 true。

#### _示例_ <!-- omit in toc -->

```js
const store = select( checkoutStore );
const editingShippingAddress = store.getEditingShippingAddress();
```

### hasError

如果发生错误，则返回 true，否则返回 false。

#### _返回值_ <!-- omit in toc -->

-   `boolean`: 如果发生错误，则返回 true。

#### _示例_ <!-- omit in toc -->

```js
const store = select( checkoutStore );
const hasError = store.hasError();
```

### hasOrder

如果已创建草稿订单，则返回 true，否则返回 false。

#### _返回值_ <!-- omit in toc -->

-   `boolean`: 如果已创建草稿订单，则返回 true。

#### _示例_ <!-- omit in toc -->

```js
const store = select( checkoutStore );
const hasOrder = store.hasOrder();
```

### isIdle

当结账状态为 `IDLE` 时，此标志为 true。 在加载阻止后，任何对结账状态的更改都会使结账处于此状态。 当在出现错误后可以重试购买时，结账也会处于此状态。

#### _返回值_ <!-- omit in toc -->

-   `boolean`: 如果结账已经有活动，但当前正在等待用户输入，则返回 true。

#### _示例_ <!-- omit in toc -->

```js
const store = select( checkoutStore );
const isIdle = store.isIdle();
```

### isBeforeProcessing

当结账状态为 `BEFORE_PROCESSING` 时，此标志为 true。 当用户提交结账以进行处理时，结账将处于此状态。

#### _返回值_ <!-- omit in toc -->

-   `boolean`: 如果订单即将被处理，则返回 true。

#### _示例_ <!-- omit in toc -->

```js
const store = select( checkoutStore );
const isBeforeProcessing = store.isBeforeProcessing();
```

### isProcessing

当结账状态为 `PROCESSING` 时，此标志为真。 结账会处于此状态，当所有在 `BEFORE_PROCESSING` 状态下触发的事件的观察者都已完成且没有发生错误时。 在此状态下，模块会向服务器发送请求，访问结账端点以处理订单。

#### _返回值_ <!-- omit in toc -->

-   `boolean`: 如果正在进行结账，则返回 `true`。

#### _示例_ <!-- omit in toc -->

```js
const store = select( checkoutStore );
const isProcessing = store.isProcessing();
```

### isAfterProcessing

当结账状态为 `AFTER_PROCESSING` 时，此标志为真。 结账会在此状态下，当模块从服务器端处理请求接收到响应后。

#### _返回值_ <!-- omit in toc -->

-   `boolean`: 如果刚刚处理了一个订单，则返回 `true`。

#### _示例_ <!-- omit in toc -->

```js
const store = select( checkoutStore );
const isAfterProcessing = store.isAfterProcessing();
```

### isComplete

当结账状态为 `COMPLETE` 时，此标志为真。 结账会在此状态下，当所有在 `AFTER_PROCESSING` 状态下触发的事件的观察者都已成功完成时。 当结账处于此状态时，购物者的浏览器将被重定向到 `redirectUrl` 的值（通常是 `order-received` 路由）。

#### _返回值_ <!-- omit in toc -->

-   `boolean`: 如果订单已完成，则返回 `true`。

#### _示例_ <!-- omit in toc -->

```js
const store = select( checkoutStore );
const isComplete = store.isComplete();
```

### isCalculating

当订单的总价正在重新计算时，此标志为真。 有许多因素可能触发订单总价的重新计算：添加或移除优惠券、更新配送费率、选择配送费率等。 此标志汇总了所有可能发生的活动（包括可能影响总价计算的服务器请求）。 因此，您无需检查每个单独的状态，只需可靠地检查此布尔值是否为 `true`（正在计算）或 `false`（未计算）。

#### _返回值_ <!-- omit in toc -->

-   `boolean`: 如果正在进行更新任何值的请求，则返回 `true`。

#### _示例_ <!-- omit in toc -->

```js
const store = select( checkoutStore );
const isCalculating = store.isCalculating();
```

### prefersCollection

如果客户选择自提订单，则返回 `true`，否则返回 `false`。

#### _返回值_ <!-- omit in toc -->

-   `prefersCollection` `boolean`: 如果购物者选择自提订单，则返回 `true`。

#### _示例_ <!-- omit in toc -->

```js
const store = select( checkoutStore );
const prefersCollection = store.prefersCollection();
```

### getRegisteredAutocompleteProviders

返回已注册的地址自动完成提供商 ID 列表。

#### _返回值_ <!-- omit in toc -->

-   _addressAutocompleteProviders_ `string[]`: 注册的地址自动补全提供商 ID 列表。

#### _示例_ <!-- omit in toc -->

```js
const store = select( checkoutStore );
const addressAutocompleteProviders = store.getRegisteredAutocompleteProviders();
```

### getActiveAutocompleteProvider

返回给定地址类型的当前地址自动补全提供商。

#### _参数_

-   _type_ `'billing' | 'shipping'`: 地址类型。

#### _返回值_ <!-- omit in toc -->

-   _activeAddressAutocompleteProvider_ `string`: 当前针对传入的地址类型，激活的地址自动补全提供商。

#### _示例_ <!-- omit in toc -->

```js
const store = select( checkoutStore );
const activeBillingProvider = store.getActiveAutocompleteProvider( 'billing' );
```

## 操作

### setPrefersCollection

将 `prefersCollection` 标志设置为 true 或 false。

#### _参数_ <!-- omit in toc -->

-   _prefersCollection_ `boolean`: 如果用户希望自取订单，则为 true。

#### _示例_ <!-- omit in toc -->

```js
const store = dispatch( checkoutStore );
store.setPrefersCollection( true );
```

### setEditingBillingAddress

将账单地址设置为编辑状态或折叠状态。注意，如果地址存在无效的字段，则不会设置为折叠状态。

#### _参数_ <!-- omit in toc -->

-   _isEditing_ `boolean`: 如果为 true，则将账单地址设置为编辑状态；如果为 false，则将其设置为折叠状态。

#### _示例_ <!-- omit in toc -->

```js
const store = dispatch( checkoutStore );
store.setEditingBillingAddress( true );
```

### setEditingShippingAddress

将配送地址设置为编辑状态或折叠状态。注意，如果地址存在无效的字段，则不会设置为折叠状态。

#### _参数_ <!-- omit in toc -->

-   _isEditing_ `boolean`: 如果为 true，则将配送地址设置为编辑状态；如果为 false，则将其设置为折叠状态。

#### _示例_ <!-- omit in toc -->

```js
const store = dispatch( checkoutStore );
store.setEditingShippingAddress( true );
```

### addAddressAutocompleteProvider

添加一个地址自动补全提供商。

#### _参数_ <!-- omit in toc -->

-   _providerId_ `string`: 提供商的名称。注意，提供商应使用 `wc.addressAutocomplete.registerAddressAutocompleteProvider` 进行注册。

#### _示例_ <!-- omit in toc -->

```js
const store = dispatch( checkoutStore );
store.addAddressAutocompleteProvider( 'my-address-provider' );
```

### setActiveAddressAutocompleteProvider

添加一个地址自动补全提供商。

#### _参数_ <!-- omit in toc -->

-   _providerId_ `string`: 设置当前自动补全提供者的 ID。请注意，提供者需要通过 `wc.addressAutocomplete.registerAddressAutocompleteProvider` 进行注册。
-   _addressType_ `'billing' | 'shipping'`:  指定当前提供者适用于哪种地址类型。由于账单地址和配送地址可能位于不同的国家，因此每个国家可能需要不同的提供者。

#### _示例_ <!-- omit in toc -->

```js
const store = dispatch( checkoutStore );
store.setActiveAddressAutocompleteProvider( 'my-address-provider', 'billing' );
```