# ScrollViewComponentElement

Class · extends [`ComponentElement`](https://api.playcanvas.com/web-components/classes/ComponentElement.md)`<ScrollViewComponent>` · category: Components

Source: https://github.com/playcanvas/web-components/blob/252f001881302c266c8d727044408c32be2bb5e7/src/components/scroll-view-component.ts#L41

The ScrollViewComponentElement interface provides properties and methods for manipulating
[`<pc-scroll-view>`](https://developer.playcanvas.com/user-manual/web-components/tags/pc-scroll-view/) elements.
The ScrollViewComponentElement interface also inherits the properties and methods of the
[HTMLElement](https://developer.mozilla.org/docs/Web/API/HTMLElement) interface.

Engine component: [ScrollViewComponent](https://api.playcanvas.com/engine/classes/ScrollViewComponent.html) (`scrollview`).

**elementSummary** The `<pc-scroll-view>` element scrolls a larger content entity within a clipped
viewport at its entity, optionally driven by the `<pc-scrollbar>` elements it references. Must be
a child of a `<pc-entity>`, `<pc-model>` or `<pc-node>`.

## Accessors

### bounceAmount

```ts
get bounceAmount(): number
set bounceAmount(value: number)
```

Gets the bounce amount.

### component

```ts
get component(): ScrollViewComponent | null
```

Gets the underlying PlayCanvas scroll view component. `null` until the element is
ready — see [ComponentElement.component](https://api.playcanvas.com/web-components/classes/ComponentElement.md#component).

### content

```ts
get content(): string
set content(value: string)
```

Gets the reference (a `pc-entity`, `pc-model` or `pc-node` name, or a document-wide `#`
selector) to the entity used as the content.

### friction

```ts
get friction(): number
set friction(value: number)
```

Gets the friction.

### horizontal

```ts
get horizontal(): boolean
set horizontal(value: boolean)
```

Gets whether scrolling along the horizontal axis is enabled.

### horizontalScrollbar

```ts
get horizontalScrollbar(): string
set horizontalScrollbar(value: string)
```

Gets the reference (a `pc-entity`, `pc-model` or `pc-node` name, or a document-wide `#`
selector) to the entity containing the horizontal scrollbar.

### horizontalScrollbarVisibility

```ts
get horizontalScrollbarVisibility(): "always" | "when-required"
set horizontalScrollbarVisibility(value: "always" | "when-required")
```

Gets the visibility of the horizontal scrollbar.

### mouseWheelSensitivity

```ts
get mouseWheelSensitivity(): Vec2
set mouseWheelSensitivity(value: Vec2)
```

Gets the mouse wheel sensitivity.

### scrollMode

```ts
get scrollMode(): "clamp" | "bounce" | "infinite"
set scrollMode(value: "clamp" | "bounce" | "infinite")
```

Gets how the scroll view behaves when the content is scrolled beyond its bounds.

### useMouseWheel

```ts
get useMouseWheel(): boolean
set useMouseWheel(value: boolean)
```

Gets whether the scroll view responds to mouse wheel events.

### vertical

```ts
get vertical(): boolean
set vertical(value: boolean)
```

Gets whether scrolling along the vertical axis is enabled.

### verticalScrollbar

```ts
get verticalScrollbar(): string
set verticalScrollbar(value: string)
```

Gets the reference (a `pc-entity`, `pc-model` or `pc-node` name, or a document-wide `#`
selector) to the entity containing the vertical scrollbar.

### verticalScrollbarVisibility

```ts
get verticalScrollbarVisibility(): "always" | "when-required"
set verticalScrollbarVisibility(value: "always" | "when-required")
```

Gets the visibility of the vertical scrollbar.

### viewport

```ts
get viewport(): string
set viewport(value: string)
```

Gets the reference (a `pc-entity`, `pc-model` or `pc-node` name, or a document-wide `#`
selector) to the entity used as the viewport.

## Methods

### getInitialComponentData

```ts
protected getInitialComponentData(): Record<string, any>
```

Returns the data the component is created with. Overridden by subclasses to supply the
initial values of their cached properties. The element's `enabled` state is not among them:
the base class adds it when it creates the component.

**Returns** `Record<string, any>`: The initial component data.

## Inherited from [ComponentElement](https://api.playcanvas.com/web-components/classes/ComponentElement.md)

- `get closestApp(): AppElement | null`
- `get closestEntity(): EntityBaseElement | null`
- `get enabled(): boolean` · `set enabled(value: boolean)`
- `protected _onReady(): void`
- `protected _resetReady(): void`
- `protected initComponent(): void`
- `ready(): Promise<ScrollViewComponentElement>`