如何在打字时使 Flutter 搜索代码工作？

我似乎真的无法弄清楚我的代码有什么问题。搜索功能似乎只有在我输入搜索查询并进行热加载后才能工作。我打字时它不能立即工作。我错过了什么吗？是不是因为API有很多数据？

我已经包含了我的代码的所有相关部分，从模型到搜索功能。

import 'dart:async';
import 'package:flutter/material.dart';
import 'dart:convert';
import 'package:http/http.dart' as http;

class Search extends StatefulWidget {
  @override
  _SearchState createState() => new _SearchState();
}

class _SearchState extends State<Search> {
  TextEditingController controller = new TextEditingController();


  Future getUserDetails() async {
    final response =
        await http.get('http://makeup-api.herokuapp.com/api/v1/products.json');
    final responseJson = json.decode(response.body);
    setState(() {
      for (Map user in responseJson) {
        _userDetails.add(UserDetails.fromJson(user));
      }
    });
  }

  @override
  void initState() {
    super.initState();
    getUserDetails();
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text('Home'),
        elevation: 0.0,
      ),
      body: new Column(
        children: <Widget>[
          new Container(
            color: Theme.of(context).primaryColor,
            child: new Padding(
              padding: const EdgeInsets.all(8.0),
              child: new Card(
                child: new ListTile(
                  leading: new Icon(Icons.search),
                  title: new TextField(
                    controller: controller,
                    decoration: new InputDecoration(
                        hintText: 'Search', border: InputBorder.none),
                    onChanged: onSearchTextChanged,
                  ),
                  trailing: new IconButton(
                    icon: new Icon(Icons.cancel),
                    onPressed: () {
                      controller.clear();
                      onSearchTextChanged('');
                    },
                  ),
                ),
              ),
            ),
          ),
          new Expanded(
            child: _searchResult.length != 0 || controller.text.isNotEmpty
                ? new ListView.builder(
                    itemCount: _searchResult.length,
                    itemBuilder: (context, i) {
                      return new Card(
                        child: new ListTile(
                          leading: new CircleAvatar(
                            backgroundImage: new NetworkImage(
                              _searchResult[i].imageLink
                            ),
                          ),
                          title: new Text(_searchResult[i].name +
                              ' ' +
                              _searchResult[i].brand),
                        ),
                        margin: const EdgeInsets.all(0.0),
                      );
                    },
                  )
                : new ListView.builder(
                    itemCount: _userDetails.length,
                    itemBuilder: (context, index) {
                      return new Card(
                        child: new ListTile(
                          leading: new CircleAvatar(
                            backgroundImage: new NetworkImage(
                              _userDetails[index].imageLink,
                            ),
                          ),
                          title: new Text(_userDetails[index].name +
                              ' ' +
                              _userDetails[index].brand),
                        ),
                        margin: const EdgeInsets.all(0.0),
                      );
                    },
                  ),
          ),
        ],
      ),
    );
  }

  onSearchTextChanged(String text) async {
    _searchResult.clear();
    if (text.isEmpty) {
      setState(() {});
      return;
    }

    _userDetails.forEach((userDetail) {
      if (userDetail.name.contains(text) ||
          userDetail.brand.contains(text)) _searchResult.add(userDetail);
    });

    setState(() {});
  }
}

List<UserDetails> _searchResult = [];

List<UserDetails> _userDetails = [];

final String url = 'http://makeup-api.herokuapp.com/api/v1/products.json';

class UserDetails {
  final String name, brand, imageLink;

  UserDetails({this.name, this.brand, this.imageLink = 'https://cdn.business2community.com/wp-content/uploads/2017/08/blank-profile-picture-973460_640.png'});

  factory UserDetails.fromJson(Map<String, dynamic> json) {
    return new UserDetails(
      name: json['name'],
      brand: json['brand'],
    );
  }
}