# View

> For the complete documentation index, see [llms.txt](https://preview.writedocs.io/llms.txt).

Versions of the same content - per language or framework - with one switcher for the whole page.

Use `View` when a page has the same content in several versions, like one per programming language. Every distinct `title` on the page becomes an option in a switcher under the page title, and only the chosen version shows.

This page has two views: switch between **JavaScript** and **Python** under the title, and the section below - its text, code, and its entries in the table of contents - changes with it.

## Getting started

**JavaScript**

### Install the JavaScript SDK

```bash
npm install acme-sdk
```

### Create a payment

```js
const payment = await acme.payments.create({ amount: 1000 });
```

**Python**

### Install the Python SDK

```bash
pip install acme-sdk
```

### Create a payment

```python
payment = acme.payments.create(amount=1000)
```

````mdx
<View title="JavaScript" icon="js">
  ### Install the JavaScript SDK

  ```bash
  npm install acme-sdk
  ```
</View>

<View title="Python" icon="python">
  ### Install the Python SDK

  ```bash
  pip install acme-sdk
  ```
</View>
````

## How it works

- A page can have several `View`s with the same title - one switcher controls all of them. Content outside any `View`, like this section, always shows.
- The table of contents lists only the headings in the version that's showing.
- The reader's choice is remembered, and carries over to other pages with views of the same titles.
- A link to a heading inside a hidden version switches to that version.

Use [Tabs](https://preview.writedocs.io/docs/content/components/tabs/) instead when only one part of a page differs, or [CodeGroup](https://preview.writedocs.io/docs/content/components/code-group/) when only a code sample does.

## Props

**`title`** `string` required

The version's name in the switcher. `View`s with the same title show and hide together.

**`icon`** `string`

Shown next to the title in the switcher. Any [icon](https://preview.writedocs.io/docs/content/components/icon/#icons).