# Data Object

 **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](https://smwb-tech.gitbook.io/vue-flash-message/custom-component) |
| **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                                                                                                                                                                                                                                                 |


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://smwb-tech.gitbook.io/vue-flash-message/data-object.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.