Flutter防抖处理插件just_debounce_it的使用

just_debounce_it 是一个简单的防抖库，支持通过函数和流进行防抖操作。以下是该库的详细用法及示例代码。

静态方法

just_debounce_it 提供了三种静态方法来设置防抖时间，它们的区别仅在于第一个参数用于指定超时值的不同格式。提供的 target 函数必须每次调用 Debounce 时都是同一个对象。

方法1: 按秒数防抖

Debounce.seconds(int timeoutSeconds, 
    Function target,
    [List<dynamic> positionalArguments, 
    Map<Symbol, dynamic> namedArguments])

方法2: 按毫秒数防抖

Debounce.milliseconds(int timeoutMs, 
    Function target,
    [List<dynamic> positionalArguments, 
    Map<Symbol, dynamic> namedArguments])

方法3: 按Duration防抖

Debounce.duration(Duration timeout, 
    Function target,
    [List<dynamic> positionalArguments, 
    Map<Symbol, dynamic> namedArguments])

立即执行并清除防抖

要立即执行之前被防抖的目标函数，并可以选择覆盖已防抖的参数：

Debounce.runAndClear( 
    Function target,
    [List<dynamic> positionalArguments, 
    Map<Symbol, dynamic> namedArguments])

清除防抖目标

要清除一个被防抖的目标函数：

Debounce.clear( 
    Function target,
    [List<dynamic> positionalArguments, 
    Map<Symbol, dynamic> namedArguments])

流防抖

使用 DebounceStreamTransformer 可以对任何流按指定的时间间隔进行防抖。

DebounceStreamTransformer(Duration timeout)
DebounceStreamTransformer.seconds(int timeoutSeconds)
DebounceStreamTransformer.milliseconds(int timeoutMs)

Stream debounceStream(Stream input) => input.transform(DebounceStreamTransformer.seconds(1));

示例代码

下面是一个完整的示例demo，展示了如何在Flutter中使用 just_debounce_it 进行防抖操作：

import 'dart:async';
import 'package:flutter/material.dart';
import 'package:just_debounce_it/just_debounce_it.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('just_debounce_it Example')),
        body: Center(child: MyWidget()),
      ),
    );
  }
}

class MyWidget extends StatefulWidget {
  @override
  _MyWidgetState createState() => _MyWidgetState();
}

class _MyWidgetState extends State<MyWidget> {
  final TextEditingController _controller = TextEditingController();
  String _result = '';

  void _onSearch(String query) {
    Debounce.milliseconds(500, () {
      setState(() {
        _result = 'Searching for "$query"...';
      });
    }, [query]);
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: <Widget>[
        Padding(
          padding: const EdgeInsets.all(8.0),
          child: TextField(
            controller: _controller,
            onChanged: _onSearch,
            decoration: InputDecoration(
              labelText: 'Enter search term',
              border: OutlineInputBorder(),
            ),
          ),
        ),
        Text(_result),
      ],
    );
  }
}

在这个例子中，当用户输入搜索词时，_onSearch 方法会在500毫秒后执行，如果在这500毫秒内用户再次输入，则会重新计时，从而实现了防抖的效果。