hero

Slim

基于Proxy的状态管理框架

快速上手 →

小巧精致

简单的API,微小的体积。

超强限制

状态更新完全被限制在reducer中,集中管理更新操作让状态变化更可预测。

独立运行

可以不依赖于任何框架单独运行。

提示

因为Slim不依赖于任何框架,所以它可以运用到任何框架,通过提供的插件机制集成到框架将变得非常的简单。

安装

CDN

<script src="https://unpkg.com/slim-store@latest/slim.min.js"></script>

NPM

npm install slim-store

Yarn

yarn add slim

代码引入

import Slim from 'slim-store'

// state is single object
const state = {
    name: 'slim',
    age: 20
}

// reducers are event proxies
const reducers = {
    increment: (state) => {
        state.age += 1
    }
}

// actions are reducer commits' controller
const actions = {
    increment: (context) => context.commit('increment')
}

// getters are computed functions of state
const getters = {
  desc: state => `My name is : ${state.name}, I'm ${state.age}-years-old!`
}

// create store
const store = Slim.createStore({
    reducers,
    actions,
    getters,
    state
})

// emit increment reducer
store.dispatch('increment')

console.log(store.state.count)
// output: 21

console.log(store.getGetter('desc'))
// output: My name is : slim, I'm 21-years-old!`

拓展设施

  • VSlim: 在Vue中基于Slim的状态管理框架
  • RSlim: 在React中基于Slim的状态管理框架