让Vue也可以使用Redux的方法

发布时间：2020-12-17 03:09:11 所属栏目：百科来源：网络整理

导读：上周末看Vuex源码，突发灵感，为什么都是Vuex

上周末看Vuex源码，突发灵感，为什么都是Vuex啊。

于是蛋疼一下午写了一个插件来帮助Vue可以使用Redux

Vue-with-Redux

这是一个用于帮助Vue使用Redux管理状态的插件。Redux是一个非常流行的状态管理工具。vue-with-redux为大家提供一个可以在Vue环境下使用Redux的途径。这回带来不同的开发体验。

开始

首先你需要通过如下命令安装vue-with-redux

运行Demo

Usage

需要像下面这样改造你的入口文件：

Vue.use(VuexRedux);

let store = makeReduxStore(reduces,[middlewares]);

new Vue({
store,render: h => h(App)
}).$mount('#app')

下面是一个actionCreate函数:

export function asyncTest() {
return (dispatch,getState) => {
setTimeout( () => {
console.log('New:',getState());
dispatch({type: 'TEST'});
console.log('Old',getState());
},100);
}
}

Note:

你并不需要使用redux-thunk，因为Vue-with-Redux已经提供了对异步处理的支持.

这是一个reducer的例子:

export default {
reduce
};

Vue的组件例子:

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持编程之家。

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!