如何在flutter中使用TextField中的onKeyUp事件

Question

我正在使用颤动来制作一个简单的应用程序。在下面的代码中，当TextBox更改事件被触发时，我调用名为updateTitle（）的方法。

但是当我们在javascript和其他语言中使用时，我必须调用相同的方法updateTitle（）。

              TextField(
                controller: titleController,
                style: textStyle,
                onChanged: (value) => updateTitle(),
                decoration: InputDecoration(
                    labelText: "Title",
                    labelStyle: textStyle,
                    border: OutlineInputBorder(
                      borderRadius: BorderRadius.circular(5.0),
                    )),
              ),

Answer 1

对于您的用例，onChangedworks就像onkyeup一样可行。每次用户点击文本字段中的新字符时，都会触发该字符。

为了启用/禁用按钮，您应该听取此事件，进行测试以查看该字段是否为空，修改将处理按钮状态的变量，并调用setState()。

这只是一个示例代码。没有经过测试，但应该按原样运行。

class _SoAnswerState extends State<SoAnswer> {

    bool _buttonActive = false;

    @override
    Widget build(BuildContext context) {

    ...

        TextField(
            controller: titleController,
            style: textStyle,
            onChanged: (value) => updateButtonState(value), // onChanged return the value of the field
            decoration: InputDecoration(
                labelText: "Title",
                labelStyle: textStyle,
                border: OutlineInputBorder(
                    borderRadius: BorderRadius.circular(5.0),
                )
            ),
        ),

    ...
    }

    void updateButtonState(String text){
        // if text field has a value and button is inactive
        if(text != null && text.length > 0 && !_buttonActive){
            setState(() {
                _buttonActive = true;
            }
        }else if((text == null || text.length == 0) && _buttonActive){
            setState(() {
                _buttonActive = false;
            }
        }
    }

编辑：添加有关事件的更多信息

在JavaScript中，当用户释放先前按下的键时，onkeyup事件处理程序将触发。当用户在文本字段内按下并释放键时，文本字段值会更改。当文本字段值发生变化时，Flutter中的onChanged监听器将触发。当使用键入界面时，用户使用传统键盘，听取文本字段的所有更改并不是一个好主意，因为用户可以按住键，使应用程序重复onchanged事件太多次，每次重复一次。移动界面并非如此，用户（通常）无法按住键。