介绍//状态(数据)和动作(控制修改)后的数据
函数减速器(状态、动作){/!*初始化状态和切换实例* !/}//通过减速机获取状态//执行行动//监听数据变化
常量存储=createStore(减速器)//监听数据变化重新渲染页面//通过观察者模式监听数据变化,避免没有状态改变的频繁渲染
store.subscribe(()=比;renderApp (store.getState ()))//首次渲染页面
renderApp (store.getState ()) const usersReducer=(状态、动作)=比;{
如果(!状态)返回[];
开关(action.type) {
例“ADD_USER":
返回[…状态,action.user]
例“DELETE_USER":
返回[…状态。片(0,action.index)……state.slice(行动。指数+ 1)
例“UPDATE_USER":
让用户={
[action.index]…状态,
……action.user,
}
返回(
……。片(0,action.index),
用户,
…state.slice(行动。指数+ 1),
]
默认值:
返回状态
}
}//状态(数据)和调度(控制修改)封装起来
函数createStore(减速器){
让国家=零
const听众=[]
const订阅=(听众)=比;listeners.push(听众)
const getState=()=比;状态
const分派=(行动)=比;{
国家=减速器(状态、动作)//覆盖原对象//console.log(听众)
listeners.forEach((听众)=比;{//console.log(听众)
侦听器()
}）
}
调度({})//初始化状态
返回{getState、调度、订阅}
}
常量存储=createStore (usersReducer);
console.log (store.getState ());//增
store.dispatch ({
类型:& # 39;ADD_USER& # 39;
用户:{
用户名:& # 39;露西# 39;
年龄:12岁
性别:& # 39;女# 39;
}
});
console.log (store.getState ());//改
store.dispatch ({
类型:& # 39;UPDATE_USER& # 39;
指数:0,
用户:{
用户名:& # 39;多美# 39;
年龄:12岁
性别:& # 39;男性# 39;
}
});
console.log (store.getState ());//删
store.dispatch ({
类型:& # 39;DELETE_USER& # 39;
指数:0//删除特定下标用户
});
console.log (store.getState ());
这篇文章给大家分享的是有关回来的的核心是什么的内容。小编觉得挺实用的,因此分享给大家做个参考。一起跟随小编过来看看吧。
<强>概念
回来的是一种架构模式,可以和反应,vue结合使用。
<强>解决的问题
优雅地修改共享数据状态,避免状态在父子组件的连锁改动(子组件多的话改起来麻烦)及外部改动造成的不必要(难以排除)问题,所以所有的改动强横通过一个方法(调度)修改。
<强>实现步骤
<强>示例
感谢各位的阅读!关于回家的的核心是什么就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识。如果觉得文章不错,可以把它分享出去让更多的人看到吧!
