# Managing Windows

## Starting the Application

To start the application, you should create a root Vue component representing a window and call `$start()`. This will display the window and start the main loop of the application:

```javascript
const window = new Vue( {
  render: h => h( MainWindow )
} );

window.$start();
```

## Exiting the Application

To exit the application, call the `$exit()` method. This will stop the main loop of the application. Typically, this is done in response to the close event:

```markup
<template>
  <Window title="Example" width="400" height="100" margined v-on:close="exit">
    ...
  </Window>
</template>

<script>
export default {
  methods: {
    exit() {
      this.$exit();
    }
  }
}
</script>
```

Note that `$exit()` automatically closes all open windows and destroys all root Vue components associated with them.

## Creating Additional Windows

Your application can consist of multiple windows. To create and display another window, create a separate root Vue component and call `$mount()` without any parameters:

{% code title="" %}

```javascript
const logWindow = new Vue( {
  render: h => h( LogWindow )
} );

logWindow.$mount();
```

{% endcode %}

Note that the `$start()` method automatically calls `$mount()` if it hasn't been called. However, if you need to display more than one window, you should use `$mount()` to display them.

## Destroying a Window

To close a window without exiting the application, call `$destroy()` on the root Vue component corresponding to that window:

```markup
<template>
  <Window title="Example" width="400" height="100" margined v-on:close="close">
    ...
  </Window>
</template>

<script>
export default {
  methods: {
    close() {
      this.$root.$destroy();
    }
  }
}
</script>
```

The root component can be accessed using the `$root` property which is part of the Vue.js API.

Note that the application will keep running in the background, even if you destroy all windows. To exit the application, call the `$exit()` method instead.


---

# 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://vuido.mimec.org/usage/managing-windows.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.