> For the complete documentation index, see [llms.txt](https://docs.corets.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.corets.io/hooks/use-value.md).

# useValue

Source code is hosted on [GitHub](https://github.com/corets/use-value)

{% tabs %}
{% tab title="yarn" %}

```bash
yarn add @corets/use-value
```

{% endtab %}

{% tab title="npm" %}

```
npm install --save @corets/use-value
```

{% endtab %}
{% endtabs %}

This is a React integration for this package:

{% content-ref url="/pages/-MeeBGx8X2I9UAm40nt5" %}
[Value](/observables/value.md)
{% endcontent-ref %}

## useValue() <a href="#usevalue" id="usevalue"></a>

Use observable values inside React components:

```typescript
import React from "react"
import { createValue } from "@corets/value"
import { useValue } from "@corets/use-value"

const globalValue = createValue(0)

const Example = () => {
  const value1 = useValue(0)
  const value2 = useValue(() => 0)
  const value3 = useValue(globalValue)
  
  // alternative syntax
  const [value, setValue] = useValue(globalValue).use()
  
  const increment = () => value1.set(value1.get() + 1)
  
  return <button onClick={increment}>Count: {value1.get()}</button>
}
```