Flux 模式實現:DeLorean
DeLoreanjs(Delorean.js) 是 Flux 模式迷你實現:
-
單向數據流,是的你的應用邏輯比 MVC 還簡單
-
自動監聽數據變化情況,保持數據持續更新
-
這是個很完整的框架,沒有視圖框架
-
非常小,壓縮后只有 4K
-
內置 React.js 集成,易于使用 Flight.js 和 Reactive.js 或者其他的 JS 庫
-
使用回滾提高 UI 和數據的一致性
示例:
/* * Stores are simple data buckets which manages data. */var Store = Flux.createStore({
data: null,
setData: function (data) {
this.data = data;
this.emit('change');
},
actions: {
'incoming-data': 'setData'
}});var store = new Store();/* * Dispatchers are simple action dispatchers for stores. * Stores handle the related action. */var Dispatcher = Flux.createDispatcher({
setData: function (data) {
this.dispatch('incoming-data', data);
},
getStores: function () {
return {increment: store};
}});/* * Action Creators are simple controllers. They are simple functions. * They talk to dispatchers. They are not required. */var Actions = {
setData: function (data) {
Dispatcher.setData(data);
}};// The data cycle.store.onChange(function () {
// End of data cycle.
document.getElementById('result').innerText = store.store.data;});document.getElementById('dataChanger').onclick = function () {
// Start data cycle:
Actions.setData(Math.random());};
本文由用戶 jopen 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!