菜单
Add the Debounce mixin to wait for user input pauses before acting. Covers setting the `debounce` duration, implementing search-as-you-type, and avoiding excessive API calls during rapid input.
默认使用会先检查来源的 Prompt；你也可以切换为直接命令，或下载本地副本。
决定是否安装前，请先阅读 SKILL.md，以及 SkillsMP 当前展示的配套文件。
用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
直接命令不会经过审查 Prompt；运行前请先检查来源。
npx skills add https://github.com/marcglasberg/async_redux --skill asyncredux-debounce-mixin命令会保持在同一行。复制前请横向滚动并检查完整内容。
想先保存到本地？可下载 SkillsMP 当前能够提供的文件。
Inject dependencies into actions using the environment, dependencies, and configuration pattern. Covers creating an Environment enum, a Dependencies class, passing them to the Store, accessing them from actions and widgets, and using dependency injection for testability.
Create a custom base action class for your app. Covers adding getter shortcuts to state parts, adding selector methods, implementing shared wrapError logic, and establishing project-wide action conventions.
Initialize, setup and configure AsyncRedux in a Flutter app. Use it whenever starting a new AsyncRedux project, or when the user requests.
基于 SOC 职业分类
正在显示 SKILL.md
| name | asyncredux-debounce-mixin |
| description | Add the Debounce mixin to wait for user input pauses before acting. Covers setting the `debounce` duration, implementing search-as-you-type, and avoiding excessive API calls during rapid input. |
The Debounce mixin delays action execution until after a period of inactivity. Each new dispatch resets the timer, so the action only runs once dispatching stops for the specified duration. This is ideal for search-as-you-type functionality and avoiding excessive API calls during rapid user input.
Add the Debounce mixin to your action class:
class SearchText extends AppAction with Debounce {
final String searchTerm;
SearchText(this.searchTerm);
Future<AppState?> reduce() async {
var response = await http.get(
Uri.parse('https://example.com/?q=${Uri.encodeComponent(searchTerm)}')
);
return state.copy(searchResult: response.body);
}
}
When the user types quickly, each keystroke dispatches SearchText. The mixin delays execution, and each new dispatch resets the timer. The API call only happens once the user stops typing for the debounce period.
The default debounce period is 333 milliseconds. Override the debounce getter to customize:
class SearchText extends AppAction with Debounce {
final String searchTerm;
SearchText(this.searchTerm);
// Wait 1 second of inactivity before executing
int get debounce => 1000;
Future<AppState?> reduce() async {
var response = await http.get(
Uri.parse('https://example.com/?q=${Uri.encodeComponent(searchTerm)}')
);
return state.copy(searchResult: response.body);
}
}
By default, all instances of a debounced action share the same lock. Override lockBuilder() to create independent debounce periods for different action instances:
class SearchField extends AppAction with Debounce {
final String fieldId;
final String searchTerm;
SearchField(this.fieldId, this.searchTerm);
// Each fieldId gets its own independent debounce timer
Object? lockBuilder() => fieldId;
Future<AppState?> reduce() async {
// Search logic here
}
}
This enables multiple search fields to operate independently, each with their own debounce timer.
These two mixins serve different purposes:
| Mixin | Behavior | Best For |
|---|---|---|
| Throttle | Runs immediately on first dispatch, then blocks subsequent dispatches for the period | Rate-limiting actions that should execute right away (e.g., refresh button) |
| Debounce | Waits for quiet time, only runs after dispatches stop | Waiting for user to finish input (e.g., search-as-you-type) |
Throttle: "Execute now, then wait before allowing again" Debounce: "Wait until activity stops, then execute"
Debounce can be combined with:
CheckInternetNoDialogAbortWhenNoInternetNonReentrantFreshThrottleDebounce cannot be combined with:
RetryUnlimitedRetriesUnlimitedRetryCheckInternetOptimisticCommandOptimisticSyncOptimisticSyncWithPushServerPushURLs from the documentation: