Fish Redux系列學習之認識effect、reducer

繼續前面兩篇文章：

Fish Redux系列學習之初探

Fish Redux系列學習之新建page以及認識state

Fish Redux系列學習之認識view、action

這次我們學習剩下的兩個effect、reducer。

先上一下page中的截圖

effect：

在SplashPage中effect裏的方法內容用的並不多，先貼個代碼上來

import 'package:fish_redux/fish_redux.dart';
import 'package:flutter/material.dart' hide Action;
import 'action.dart';
import 'state.dart';

Effect<SplashState> buildEffect() {
  return combineEffects(<Object, Effect<SplashState>>{
    SplashAction.action: _onAction,
    Lifecycle.build: _onInitState,
  });
}

void _onAction(Action action, Context<SplashState> ctx) {
}

void _onInitState(Action action, Context<SplashState> ctx) {
//  Navigator.pushNamedAndRemoveUntil(
//      ctx.context, RoutesConstant.MAIN_PAGE, (router) => router == null);

  Future.delayed(Duration(milliseconds: 1), () {
    Navigator.pushNamedAndRemoveUntil(
        ctx.context, RoutesConstant.MAIN_PAGE, (router) => router == null);
  });
}

在effect中可以進行相應的數據初始化，以及在page生命週期中進行相對應的數據操作。

如下圖，見名知意

上面說的內容有些少，我再從其他page中的effect裏再截一個多一些的圖，如下：

從這裏我們可以看到一些頁面跳轉的具體實現邏輯就是在這個部分進行的，當然，你也可以在這個頁面進行一些網絡請求、讀取數據庫等操作。

reducer：

先上代碼：

import 'package:fish_redux/fish_redux.dart';

import 'action.dart';
import 'state.dart';

Reducer<SplashState> buildReducer() {
  return asReducer(
    <Object, Reducer<SplashState>>{
      SplashAction.action: _onAction,
    },
  );
}

SplashState _onAction(SplashState state, Action action) {
  final SplashState newState = state.clone();
  return newState;
}

說實在的reducer這個玩意我也不是很太懂，用得也不是很多，這些都是自動生成的。

reducer的作用是接收某個意圖（action），然後對數據做出修改，即更新狀態（state）。

effect的用法跟 reducer 類似，但是責任不同。他負責處理“副作用”，這是函數式編程的概念。在這裏簡單地理解爲，reducer是負責（state）的更新，effect 負責 state 更新之外的事情。

大概是這樣，建議去深度redux。

我前前後後找了一遍reducer的文件，目前一個也還沒有在此基礎上進行操作。

總結：

對於fishredux的使用步驟：

1. 使用模版FishReduxTemplate生成你所需要的文件，如：state.dart、view.dart、page.dart 、action.dart 、 effect.dart、然後接下來你需要記住的是：
2. state.dart是進行狀態操作的，是數據源，你所定義的page裏面的字段都需要寫在這。
3. view.dart是直接寫view的地方，就是你寫的界面內容都在這裏面進行。
4. action.dart是定義事件的，比如頁面跳轉，刷新數據，所定義的action都在這。
5. effect.dart是具體的事件實現，類似Java中的impl即具體實現類。
6. page.dart是組裝以上4個的，當然也包括未提及的adapter、reducer。基本上page.dart中的文件不用動。

以上就是對FishRedux的學習使用總結。