每次按下按钮都会触发本机 TextInput onSubmitEditing

Posted 2023-04-18

【中文标题】每次按下按钮都会触发本机 TextInput onSubmitEditing

【英文标题】：React Native TextInput onSubmitEditing firing with every button press

【发布时间】：2021-04-09 15:30:45

【问题描述】：

我在每次按下输入键盘的按钮和当前页面首次加载时触发 onSubmitEditing 时遇到问题（该部分特别令人费解）。 TextInput 代码如下：

const TimerInput = () => 
    const [ value, onChangeText ] = React.useState('');
    return (
        <TextInput
            style=
                backgroundColor: ColorScheme.Orange.e,
                borderRadius: 10,
                borderWidth: 0,
                fontSize: 25,
                height: 60,
                textAlign: 'center',
                shadowColor: 'gray',
                shadowRadius: 10,
                width: '80%',
            
            keyboardType = 'number-pad'
            onSubmitEditing = FormatTime(value)
            onChangeText =  text => onChangeText(text) 
            placeholder =  ' Hours : Minutes : Seconds ' 
            returnKeyType = 'done'
            value = value
        />
    );

FormatTime 函数只是在我试图弄清楚这一点时写入控制台：

FormatTime = () => 
    return (
        console.log('test')
    );

我希望实现的行为是仅在按下“完成”按钮关闭输入键盘时才运行 FormatTime。老实说，我不完全确定 TextInput 是如何工作的（即我对“值”和“文本”之间的区别感到非常困惑），所以我可能在这里遗漏了一些明显的东西。非常感谢您的帮助。

【参考方案1】：

因为每次按下按钮（以及首次加载页面时），都会重新渲染......使用您的代码，它执行 FormatTime .. 但它应该绑定 FormatTime 作为onSubmitEditing 事件的处理程序

这样你传递一个处理程序而不是一个函数调用

 onSubmitEditing = () => FormatTime(value)

【讨论】：

非常感谢您的帮助；这立即解决了它。我有很多东西要学...