1.0.1 • Published 2 years ago

rbox v1.0.1

Weekly downloads
-
License
ISC
Repository
github
Last release
2 years ago

rbox

npm version https://github.com/rboxjs/rbox/actions?query=test

轻量的数据管理器

  • 小而简,专注于数据管理
  • 高效,没有拐弯抹角的东西
  • 完美支持typescript

文档

详细的文档请点击 这里

快速开始

  1. 安装依赖

npm install rbox --save npm install rbox-react --save

  1. 定义数据
import {createStore} from 'rbox'

const mArticles = ()=>{
    return createStore({
        loading:false,
        list:[],
        actions:{
            setLoading(status){
              this.core.updateData({
                  loading:status
              })  
            },
            async getPageData(){
                this.actions.setLoading(true)
                try{
                    const data = await fetch('/api/articles');
                    
                    this.core.updateData({
                        list:data
                    })
                }
                finally {
                    this.actions.setLoading(false)
                }
            }
        }
    })
}
  1. 在react中使用
import React,{useEffect} from 'react'
import {useStores} from 'rbox-react'

const ArticlesComponent = ()=>{
    const [sArticles] = useStores([mArticles()])

    useEffect(()=>{
        sArticles.actions.getPageData();
    },[])
    
    if(sArticles.loading){
        return <div>loading...</div>
    }
    
    return sArticles.list.map(item=>{
        return <div>
            <h3>{item.title}</h3>
            <div>{item.content}</div>
        </div>
    })
}

License

MIT