# createComponent()

> createComponent() is called by merchant applications to create and display payment or vaulting component UIs.

`createComponent()` is called by merchant applications to create and display payment or vaulting component UIs.

> **Notes**:
>
> -   This method must be called after [`init()`](https://docs.antom.com/ac/sdks/flutter_init.md) .
> -   This method is mutually exclusive with [`confirmPayment()`](https://docs.antom.com/ac/sdks/flutter_confirmPayment.md) .
> -   In the [Payment Element](https://docs.antom.com/ac/cashierpay/element.md?platform=flutter) scenario, _paymentSessionData_ must be obtained from the server's [**createPaymentSession (One-time Payments)**](https://docs.antom.com/ac/ams/session_cashier.md) API response.
> -   In the Vaulting Element scenario, _v__au__ltingSessionData_ must be obtained from the server's [**createVaultingSession**](https://docs.antom.com/ac/ams/vaulting_session.md) API response.

## **Method signature**

#### Tab: Payment Element scenario

```dart
Future<void> createComponent(
  String paymentSessionData,
  void Function(AMSStatusResult) onResult,
)
```

#### Tab: Vaulting Element scenario

```dart
Future<void> createComponent(
  String vaultSessionData,
  void Function(AMSStatusResult) onResult,
)
```

## Parameters

| **Parameter** | **Data type** | **Is required?** | **Description** |
| --- | --- | --- | --- |
| _paymentSessionData_ | String | Yes | Payment session data. Pass the complete _paymentSessionData_ value obtained from the [**createPaymentSession (One-time Payments)**](https://docs.antom.com/ac/ams/session_cashier.md) API response into this parameter. > **Notes**: > > - In the [Payment Element](https://docs.antom.com/ac/cashierpay_zh-cn/element.md?platform=flutter) scenario, this parameter is required. > - Either this parameter or _vaultSessionData_ must be provided. |
| _vaultSessionData_ | String | Yes | Vaulting session data. Pass the complete _vaultingSessionData_ value obtained from the [**createVaultingSession**](https://docs.antom.com/ac/ams/vaulting_session.md) API response into this parameter. > **Notes**: > > - In the Vaulting Element scenario, this parameter is required. > - Either this parameter or _paymentSessionData_ must be provided. |
| _onResult_ | Function | Yes | Initialization result callback function. Used to return the result of successful or failed initialization. Refer to [`onResult`](#HgPUP) for details. |

### onResult

The result callback from the `createComponent()` method receives an [`AMSStatusResult`](https://docs.antom.com/ac/sdks/flutter_AMSStatusResult.md) object indicating whether the initialization was successful.

| **Parameter** | **Data type** | **Is required?** | **Description** |
| --- | --- | --- | --- |
| _result_ | [AMSStatusResult](https://docs.antom.com/ac/sdks/flutter_AMSStatusResult.md) | Yes | Status results containing initialization status and error details. |

## Return value

This method returns no value, and the initialization result is returned asynchronously through the [`onResult`](#HgPUP) callback.

## Error codes

Error messages are returned via [`AMSStatusResult`](https://docs.antom.com/ac/sdks/flutter_AMSStatusResult.md) in the `onResult` callback. When `getStatus()` returns `FAIL` , you can obtain error details through `getError()`.

| _**code**_ | _**status**_ | **Suggested prompt to the buyer (**_**message**_**)** | **Description** | **Further action** |
| --- | --- | --- | --- | --- |
| `INQUIRY_PAYMENT_SESSION_FAILED` | `FAIL` | The order status is abnormal. Please check the payment status and contact the merchant. | The payment session has expired. | The order has timed out and been closed. Use a new _paymentRequestId_ to initiate the payment again. |
| `PARAM_INVALID` | N/A | An error occurred. The transaction cannot be initiated. | SDK input parameters are abnormal. | Integration code exception. Troubleshoot yourself required. If the problem persists, contact Antom Technical Support. |
| `UI_STATE_ERROR` | N/A | An error occurred. The transaction cannot be initiated. | Abnormal timing when creating SDK instances or `createComponent()`. | Integration code exception. Troubleshoot yourself required. If the problem persists, contact Antom Technical Support. |
| `INITIALIZE_WEB_TIMEOUT` | N/A | An error occurred. The transaction cannot be initiated. | The checkout page static resource loading had timed out. | Buyer network exception or Antom service exception detected. Retry the `createComponent()` method. |