Skip to main content
Module

x/valtio/docs/advanced/ref.mdx

πŸ’Š Valtio makes proxy-state simple for React and Vanilla
Go to Latest
File
---title: 'ref'section: 'Advanced'description: 'Create a ref object'---
# ref
#### A ref allows unproxied state in a Valtio proxy
A `ref` is useful in the rare instances you to nest an object in a `proxy` that is not wrapped in an inner proxy and, therefore, is not tracked.
```jsconst store = proxy({ users: [ { id: 1, name: 'Juho', uploads: ref([]) }, ] })})```
Once an object is wrapped in a ref, it should be mutated without resetting the object or rewrapping in a new ref.
```js// do mutatestore.users[0].uploads.push({ id: 1, name: 'Juho' })// do resetstore.users[0].uploads.splice(0)
// don'tstore.users[0].uploads = []```
A ref should also not be used as the only state in a proxy, making the proxy usage pointless.
## Codesandbox demo
https://codesandbox.io/s/valtio-file-load-demo-oo2yzn