---
source_url: https://www.pubnub.com/docs/sdks/vue/api-reference/channel-groups
title: Channel Groups API for Vue SDK
updated_at: 2026-06-05T11:13:41.236Z
---

> Documentation Index
> For a curated overview of PubNub documentation, see: https://www.pubnub.com/docs/llms.txt
> For the full list of all documentation pages, see: https://www.pubnub.com/docs/llms-full.txt


# Channel Groups API for Vue SDK

[Channel groups](https://www.pubnub.com/docs/general/channels/subscribe#channel-groups) allow PubNub developers to bundle thousands of [channels](https://www.pubnub.com/docs/general/channels/overview) into a group that can be identified by a name. These channel groups can then be subscribed to, receiving data from the many back-end channels the channel group contains.

:::note Channel group operations
You can't publish to a channel group. You can only subscribe to it. To publish within the channel group, you need to publish to each channel individually.
:::

## Add channels to a channel group

:::note Requires Stream Controller add-on
This method requires that the *Stream Controller* add-on is enabled for your key in the [Admin Portal](https://admin.pubnub.com/). Read the [support page](https://support.pubnub.com/hc/en-us/articles/360051974791-How-do-I-enable-add-on-features-for-my-keys-) on enabling add-on features on your keys.
:::

### Description

This function adds a channel to a channel group.

### Method(s)

`Adding Channels` is accomplished by using the following method(s) in the Vue SDK:

:::note Maximum number of channels
You can add up to 200 channels to a channel group per API call.
:::

```javascript
pubnub.channelGroups.addChannels({Array channels, String channelGroup},Function callback)
```

| Parameter | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| channels | Array | Yes |  | The `channel` to add to the channel group. |
| channelGroup | String | Yes |  | The `channelGroup` to add the channels to. |
| callback | Function | Optional |  | Executes on a successful/unsuccessful `addChannels`. |

### Sample code

#### Add channels

```javascript
import PubNubVue from 'pubnub-vue';

const pubnub = PubNubVue.getInstance();

pubnub.channelGroups.addChannels(
    {
        channels: ['ch1', 'ch2'],
        channelGroup: "myChannelGroup"
    },
    function(status) {
        if (status.error) {
            console.log("operation failed w/ status: ", status);
        } else {
            console.log("operation done!");
        }
    }
);
```

### Response

```javascript
{
    error: false,
    operation: "PNAddChannelsToGroupOperation",
    statusCode: 200
}
```

## List channels in a channel group

:::note Requires Stream Controller add-on
This method requires that the *Stream Controller* add-on is enabled for your key in the [Admin Portal](https://admin.pubnub.com/). Read the [support page](https://support.pubnub.com/hc/en-us/articles/360051974791-How-do-I-enable-add-on-features-for-my-keys-) on enabling add-on features on your keys.
:::

This function lists all the channels of the channel group.

### Method(s)

`Listing Channels` is accomplished by using the following method(s) in the Vue SDK:

```javascript
pubnub.channelGroups.listChannels({String channelGroup},Function callback)
```

| Parameter | Description |
| --- | --- |
| `channelGroup` *Type: String | `Channel Group` to list the channel(s) of. |
| `callback`Type: Function | Executes on a successful/unsuccessful `listChannels`. |

### Sample code

#### List channels

```javascript
import PubNubVue from 'pubnub-vue';

const pubnub = PubNubVue.getInstance();

// assuming an intialized PubNub instance already exists
pubnub.channelGroups.listChannels(
    {
        channelGroup: "myChannelGroup"
    },
    function(status, response) {
        if (status.error) {
            console.log("operation failed w/ error:", status);
            return;
        }

        console.log("listing push channel for device");
        response.channels.forEach( function(channel) {
            console.log(channel);
        });
    }
);
```

### Response

```javascript
// Example of Status
{
    error: false,
    operation: "PNChannelsForGroupOperation",
    statusCode: 200
}

// Example of Response
{
    channels: ["ch1", "ch2"]
}
```

## Remove channels from a channel group

:::note Requires Stream Controller add-on
This method requires that the *Stream Controller* add-on is enabled for your key in the [Admin Portal](https://admin.pubnub.com/). Read the [support page](https://support.pubnub.com/hc/en-us/articles/360051974791-How-do-I-enable-add-on-features-for-my-keys-) on enabling add-on features on your keys.
:::

This function removes the channels from the channel group.

### Method(s)

`Removing Channels` is accomplished by using the following method(s) in the Vue SDK:

```javascript
pubnub.channelGroups.removeChannels({Array channels, String channelGroup},Function callback)
```

| Parameter | Description |
| --- | --- |
| `channels` *Type: Array | The `channel` to remove from the `channel` group. |
| `channelGroup` *Type: String | The `channelGroup` to remove the channels from. |
| `callback`Type: Function | Executes on a successful/unsuccessful `removeChannels`. |

### Sample code

#### Remove channels

```javascript
import PubNubVue from 'pubnub-vue';

const pubnub = PubNubVue.getInstance();

// assuming an initialized PubNub instance already exists
pubnub.channelGroups.removeChannels(
    {
        channels: ['son'],
        channelGroup: "family"
    },
    function(status) {
        if (status.error) {
            console.log("operation failed w/ error:", status);
        } else {
            console.log("operation done!");
        }
    }
);
```

### Response

```javascript
{
    error: false,
    operation: "PNRemoveChannelsFromGroupOperation",
    statusCode: 200
}
```

## Delete a channel group

:::note Requires Stream Controller add-on
This method requires that the *Stream Controller* add-on is enabled for your key in the [Admin Portal](https://admin.pubnub.com/). Read the [support page](https://support.pubnub.com/hc/en-us/articles/360051974791-How-do-I-enable-add-on-features-for-my-keys-) on enabling add-on features on your keys.
:::

### Description

This function removes the channel group.

### Method(s)

`Deleting Channel Group` is accomplished by using the following method(s) in the Vue SDK:

```javascript
pubnub.channelGroups.deleteGroup({String channelGroup},Function callback)
```

| Parameter | Description |
| --- | --- |
| `channelGroup` *Type: String | The `channelGroup` to remove. |
| `callback`Type: Function | Executes on a successful/unsuccessful `deleteGroup`. |

### Sample code

#### Delete channel group

```javascript
import PubNubVue from 'pubnub-vue';

const pubnub = PubNubVue.getInstance();

pubnub.channelGroups.deleteGroup(
    {
        channelGroup: "family"
    },
    function(status) {
        if (status.error) {
            console.log("operation failed w/ error:", status);
        } else {
            console.log("operation done!");
        }
    }
);
```

### Response

```javascript
{
    error: false,
    operation: "PNRemoveGroupOperation",
    statusCode: 200
}
```