https://github.com/afeiship/next-react-valtio
Valtio for react.
https://github.com/afeiship/next-react-valtio
computed derived getters next proxy react state store val valtio
Last synced: about 2 months ago
JSON representation
Valtio for react.
- Host: GitHub
- URL: https://github.com/afeiship/next-react-valtio
- Owner: afeiship
- License: mit
- Created: 2024-01-20T00:27:21.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2024-02-23T00:50:59.000Z (about 1 year ago)
- Last Synced: 2025-02-07T12:31:43.687Z (3 months ago)
- Topics: computed, derived, getters, next, proxy, react, state, store, val, valtio
- Language: JavaScript
- Homepage:
- Size: 19.5 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE.txt
Awesome Lists containing this project
README
# next-react-valtio
> Valtio for react.
[![version][version-image]][version-url]
[![license][license-image]][license-url]
[![size][size-image]][size-url]
[![download][download-image]][download-url]
## installation
```bash
yarn add valtio derive-valtio
yarn add @jswork/next-react-valtio
```
## usage
```js
import '@jswork/next-react-valtio';
```
```jsx
const InteractiveList = () => {
const getters = {
size: (state) => state.length
};
const { state, store, computed } = nx.$valtio([1, 2, 3, 4], getters);
return (
Vite + React
store.push(state.length + 1)}>添加
{
store.splice(0, state.length, ...['a', 'b', 'c', 'd', 'e']);
}}>
Reset
{state.map((item, index) => (
{item}
store.splice(index, 1)}>删除
))}
{state.length === 0 && 暂无数据}
);
};
export default InteractiveList;
```
## license
Code released under [the MIT license](https://github.com/afeiship/next-react-valtio/blob/master/LICENSE.txt).
[version-image]: https://img.shields.io/npm/v/@jswork/next-react-valtio
[version-url]: https://npmjs.org/package/@jswork/next-react-valtio
[license-image]: https://img.shields.io/npm/l/@jswork/next-react-valtio
[license-url]: https://github.com/afeiship/next-react-valtio/blob/master/LICENSE.txt
[size-image]: https://img.shields.io/bundlephobia/minzip/@jswork/next-react-valtio
[size-url]: https://github.com/afeiship/next-react-valtio/blob/master/dist/next-react-valtio.min.js
[download-image]: https://img.shields.io/npm/dm/@jswork/next-react-valtio
[download-url]: https://www.npmjs.com/package/@jswork/next-react-valtio