@action-land/snabbit 中文文档教程
@action-land/snabbit
基于Action 的功能组件
Component
一个组件由 4 个纯函数组成 —
init
: Creates the initial state of the component.update
: Is a reducer function.command
: Is a command function.view
: Takes in the state and other params and returns a virtual dom element.- Components are framework agnostic.
export interface Component<State, Params, VNode> {
init(p?: Partial<State>): State
update<T>(action: Action<T>, state: State): State
command<T, R>(action: Action<T>, state: State): Action<R>
view(e: Hoe, m: State, p: Params): VNode
}
init()
- Takes in one argument which contains a partial version of the
State
, ie. all properties are optional. - Returns a new version of the
State
.
function init(p?: Partial<State>): State
update()
- Its an [update function] that takes in an Action and a
State
and returns a newState
.
function update (action: Action, state: State): State
command()
- Its an command function that takes in an Action and a
State
and returns a new Action.
function command (action: Action, state: State): Action
view()
- Takes in three arguments —
Hoe
,State
andParams
. - Returns a new virtual dom element —
VNode
. VNode
can be anything implementation from [React], [snabbdom] etc.
function view(e: Hoe, s: State, p: Params): VNode
@action-land/snabbit
Action based functional components
Component
A component is set of 4 pure functions —
init
: Creates the initial state of the component.update
: Is a reducer function.command
: Is a command function.view
: Takes in the state and other params and returns a virtual dom element.- Components are framework agnostic.
export interface Component<State, Params, VNode> {
init(p?: Partial<State>): State
update<T>(action: Action<T>, state: State): State
command<T, R>(action: Action<T>, state: State): Action<R>
view(e: Hoe, m: State, p: Params): VNode
}
init()
- Takes in one argument which contains a partial version of the
State
, ie. all properties are optional. - Returns a new version of the
State
.
function init(p?: Partial<State>): State
update()
- Its an [update function] that takes in an Action and a
State
and returns a newState
.
function update (action: Action, state: State): State
command()
- Its an command function that takes in an Action and a
State
and returns a new Action.
function command (action: Action, state: State): Action
view()
- Takes in three arguments —
Hoe
,State
andParams
. - Returns a new virtual dom element —
VNode
. VNode
can be anything implementation from [React], [snabbdom] etc.
function view(e: Hoe, s: State, p: Params): VNode