> For the complete documentation index, see [llms.txt](https://smwb-tech.gitbook.io/vue-flash-message/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://smwb-tech.gitbook.io/vue-flash-message/data-object.md).

# Data Object

The first argument of displat method is data object.

&#x20;**Example:**

```javascript
    methods: {
        deleteTrouble() {
            this.$axios.delete(`/delete/trouble/${trouble.id}`)
                .then( res => {
                    let { status, data, error } = res.data;
                    if(status) {
                        this.flashMessage.success({
                            title: 'Don\'t Warry',
                            message: 'Be Happy!',
                            time: 5000,
                            blockClass: 'custom-block-class'
                        });
                    }
                    else {
                        this.flashMessage.error({title: error.name || 'Error', message: error.message});
                    }
                })
                .catch(e);
        }
    }
```

| Property          | Type        | Description                                                                                                                                                                                                                                                                                                                                            |
| ----------------- | ----------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| **status**        | **String**  | Status of component. Default presets: 'error', 'warning', 'info', 'success'                                                                                                                                                                                                                                                                            |
| **title**         | **String**  | Title of your message                                                                                                                                                                                                                                                                                                                                  |
| **message**       | **String**  | Text of your message                                                                                                                                                                                                                                                                                                                                   |
| **time**          | **Number**  | Duration (in ms) of the single message. If time equal to 0, message will be show until user click on it. Please, if you combine {clickable: false , time: 0 } in case when you show your own component in flash message block, you should provide user interface element to close message window. [Learn more](/vue-flash-message/custom-component.md) |
| **icon**          | **String**  | A URL for icon or image to display                                                                                                                                                                                                                                                                                                                     |
| **clickable**     | **Boolean** | Allows to control whether the user can remove message by click on it or not                                                                                                                                                                                                                                                                            |
| **blockClass**    | **String**  | Сustom class name for flashMessage block                                                                                                                                                                                                                                                                                                               |
| **wrapperClass**  | **String**  | Custom class name for wrapper block                                                                                                                                                                                                                                                                                                                    |
| **iconClass**     | **String**  | Custom class name for icon block                                                                                                                                                                                                                                                                                                                       |
| **contentClass**  | **String**  | Custom class name for content block                                                                                                                                                                                                                                                                                                                    |
| **position**      | **String**  | In case, when you want to set up custom "fixed" position relative to viewport, you can pass string 'left/right-top/bottom'. Available positions: 'top left', 'top right', 'bottom left', 'bottom right'.                                                                                                                                               |
| **x**             | **Number**  | Amount of pixels to position your message relating to the 'X' axis                                                                                                                                                                                                                                                                                     |
| **y**             | **Number**  | Amount of pixels to position your message relating to the 'Y' axis                                                                                                                                                                                                                                                                                     |
| **html**          | **String**  | You can pass a string with raw html to render inside flash message block                                                                                                                                                                                                                                                                               |
| **componentName** | **String**  | Register your vue component globally and pass in componentName property of data object to display it inside flash message block                                                                                                                                                                                                                        |
