# Add / Remove listeners

## Methods

### addListener

▸ **addListener**(`event`, `listener`): `void`

`addListener` can be used to install an event listener in order to be able
react to the widget internal events.


```ts
// listen to when a conversation starts
const listener = (payload) => console.log(payload);
_dixa_.addListener('on-conversation-started', listener);
```

#### Type parameters

| Name | Type |
|  --- | --- |
| `Event` | properties of [`HostNotificationEvents`](/docs/dixamessenger/web/interfaces/hostnotificationevents) |


#### Parameters

| Name | Type | Description |
|  --- | --- | --- |
| `event` | `Event` | is the event you wish to listen to |
| `listener` | (`payload`: [`HostNotificationEvents`](/docs/dixamessenger/web/interfaces/hostnotificationevents)[`Event`]) => `void` | is the callback function you register for this event |


#### Returns

`void`

### removeListener

▸ **removeListener**(`event`, `listener`): `void`

`removeListener` can be used to remove an event listener in order stop listening to
that particular event.


```ts
// stop listening to  conversation-started events
const listener = (payload) => console.log(payload);
_dixa_.removeListener('on-conversation-started', listener);
```

#### Returns

`void`

### invoke

▸ **invoke**(`method`, `payload`): `void`

`init` method. Once called, the widget iframe will be added to the DOM, the widget will
be initialized and the toggler will show up (if it is not disabled in the payload).

The payload can be used to customize the initialization behavior, for example it is possible to hide
the default toggler button setting the `hideToggler` property to true:


```ts
_dixa_.invoke('init', {
  messengerToken: '[YOUR_MESSENGER_TOKEN]',
  hideToggler: true,
});
```

You can find all the options in the [Commands](/docs/dixamessenger/web/commands) page.

#### Returns

`void`