如何让Flipper中Redux Debugger插件自动选中最新日志动作？

云上老周

2026-7-24

让Flipper Redux Debugger自动选中最新动作的方案

方案1：配置插件自带的自动选中参数

Flipper的Redux Debugger插件原生支持自动选中最新动作，你只需要在初始化时添加对应的配置项即可。

在Redux中间件中配置

找到你创建Redux store的代码，修改reduxDebugger的初始化参数：

import { createStore, applyMiddleware } from 'redux';
import { reduxDebugger } from 'flipper-plugin-redux-debugger';

const store = createStore(
  rootReducer,
  applyMiddleware(
    reduxDebugger({
      autoSelect: true, // 开启自动选中最新动作
      autoScroll: true, // 同步开启自动滚动到列表底部
    })
  )
);

在Expo配置文件中设置

如果是通过Expo的app.json配置Flipper插件，直接添加参数：

{
  "expo": {
    "flipper": {
      "plugins": [
        ["flipper-plugin-redux-debugger", { "autoSelect": true, "autoScroll": true }]
      ]
    }
  }
}

方案2：自定义中间件主动触发选中

如果自带配置不生效，可自定义一个简单的中间件，在每次dispatch动作后通知Flipper选中该动作：

import { connectToDevTools } from 'flipper-plugin-redux-debugger';

const autoSelectLatestAction = store => next => action => {
  const result = next(action);
  const devToolsConn = connectToDevTools();
  if (devToolsConn) {
    // 发送选中动作的指令到Flipper
    devToolsConn.send('SELECT_ACTION', { actionId: action.type });
  }
  return result;
};

// 将该中间件添加到store的中间件链中
const store = createStore(
  rootReducer,
  applyMiddleware(reduxDebugger(), autoSelectLatestAction)
);