首页 > 解决方案 > 获取用户输入总是返回“未定义”

问题描述

我有一些文本字段,我正在尝试将用户键入的任何内容打印到控制台,代码如下:

export default function CreateOrderPage() {

    const [state, setState] = useState ({
        companyName: '',
        beginDate: ''
    })

    return (
        {/* Some code */}

        <TextInput style = {styles.inputText} 
            placeholder = {'Company name'}
            placeholderTextColor = {'#B2B2B2'}
            onChangeText = {text => setState(text)}
            value = {state.companyName}
        />

        <TextInput style = {styles.inputText} 
            placeholder = {'Order placed date'}
            placeholderTextColor = {'#B2B2B2'}
            onChangeText = {text => setState(text)}
            value = {state.beginDate}
        />

        <TouchableOpacity style = {styles.saveButton} onPress = {() => {
          console.log(state.companyName, state.beginDate);
        }}> 
            <Text style = {styles.saveButtonText}>Save</Text>
        </TouchableOpacity>
    )
}

出于某种原因,它总是打印出“未定义未定义”,我从教程中复制了完全相同的内容并对其进行了一些更改,我什至尝试了 StackOverFlow 中给出的解决方案,但对我没有任何帮助,感谢您的反馈!

PS:我是 React Native 的新手,如果我没有使用正确的术语,我深表歉意。

标签: reactjsreact-native

解决方案


状态看起来是这样的

 const [name, setName] = useState ('')
    const [date, setDate] = useState ('')

功能看起来像这样

 const   onChangeText = e => setName(e.target.value)

 const   onChangeDate = e => setDate(e.target.value)

输入看起来像这样

<TextInput style = {styles.inputText} 
        onChange={onChangeText }
            value = {text}
        />
 <TextInput style = {styles.inputText} 
         onChange={onChangeDate }
            value = {date}
        />

推荐阅读