tarojs-qtx
tarojs-qtx是对redux使用方式的扩展,用更少的代码完成工作。
安装
npm install --save tarojs-qtx
状态管理以modal为单位,而一个modal应具有属性:
namespace (命名空间),
- 该属性自动生成type字段前缀,如:type: "user/initInfo"
namespace: "user"
state (初始化数据+结构),
- 该属性可用于reducer处理时state的初始化数据,
- 还可以形如:"user.nickName" 这样快速访问state.nickName的值
state: nickName: "" gender: 0 className: "" likes:
getters (包裹一层获取state数据的方法),
- 该属性主要是getter处理函数的映射,处理函数的唯一参数为:state,
//获取性别getters: { return stategender + "" === "0" ? "男" : "女" } { return "你猜猜" }
actions (主要用于触发state更新),
- 该属性主要是action触发函数的映射,返回值为payload
- action的触发函数名与reducer处理函数名对应
- 当返回的是个函数时,该函数的唯一参数为push
- push为一个包装函数,接收两个参数:reducer处理函数名参数 和 payload
actions: //添加兴趣爱好 likeName //初始化信息 async { let data = await return data }
reducers (处理state如何更新),
- 该属性主要是reducer处理函数的映射,接收两个参数:state 和 payload
- 处理函数返回新的state
reducers: //初始化信息 { return ...initState } //添加兴趣爱好 { let likes = statelikes iflikes === -1 likes return ...state likes }
接下来是tarojs-qtx提供的几个API
getReducers (生成reducer),
initStore (对store实例进行初始化),
;; let reducers = ;const store = //注:创建完成后,需要对store进行初始化,因getter, action 扩展API需要用到store;;
autoConnect (自动连接redux与react函数),
- 形如react-redux的connect,但是导入的mapStateToProps, mapDispatchToProps参数形式大不一样了
- mapStateToProps出现同名时,优先级: getter函数 > state属性
- mapDispatchToProps出现同名时,优先级: action函数 > reducer函数
@
getter (获取state数据),
const userGender = const className =
action (触发更新state数据),
//无需返回值"游泳""游泳"//需要返回值let initInfo = async { let info = await params console}