# Contextual Save Bar

> 在 Shoplazza 应用中显示或隐藏 App Bridge 的 Contextual Save Bar，并配置表单未保存时的保存与放弃按钮。

Contextual save bar 为商家提供在完成页面表单修改后保存或放弃更改的选项。此外，在创建新对象（如商品或客户）时，该组件也会显示。

## 配置

在入口文件中创建应用。

```javascript
// 嵌入式应用入口文件
import { app } from 'shoplazza-app-bridge';

app.init();
```

## 显示

显示或隐藏 contextual save bar。

```javascript
import { contextualSaveBar } from 'shoplazza-app-bridge';

contextualSaveBar.show();
contextualSaveBar.hide();
```

## 更新选项

您可以随时修改选项。若 contextual save bar 正在显示，UI 将立即更新。

```javascript
contextualSaveBar.setSaveAction({
  type: 'primary',
  disabled: false,
  loading: false,
  text: 'Save',
  onClick: () => {
    // Do somethings
  }
});
contextualSaveBar.setDiscardAction({
  type: 'default',
  disabled: false,
  loading: false,
  text: 'Cancel',
  discardConfirmationModal: true,
  onClick: () => {
    // Do somethings
  }
});
```