Question

我总是收到此错误

Cannot read property 'todoText' of null in react native

提交表格。我正在尝试创建一个提交值的表单。

import * as React from "react";
import { View, Text, StyleSheet, TextInput, TouchableOpacity } from 'react-native';

interface TodoState{
    todoText?: string;
}
interface TodoProps{
    text: string;
}
export default class AddTodo extends React.Component <TodoProps,TodoState> {

    constructor(props:TodoProps){
        super(props);
        this.setState({todoText:" "});
    }

    handleSubmit = () => {
        console.log(this.state.todoText);
    }

    updateText = (text) => {
        this.setState((state) => {
            return { todoText: text };
        });
    };

    render() {
        return (
            <View style={{margin: 128, marginLeft: 15, marginRight:15}}>
                <TextInput style={styles.input} placeholder='Todo' onChangeText={(text) => this.setState({todoText:text})} value={this.state.todoText} />
                <TouchableOpacity onPress={this.handleSubmit.bind(this)}>
                    <Text style={styles.button}>Submit</Text>
                </TouchableOpacity>
            </View>
        )
    }
}

我试图遵循这个link，但我总是得到那个错误。正如我在反应中所理解的那样，它以我绑定函数的方式工作。我不知道反应原生是否有另一种方式来做这件事。我已经按照它的文件。我错过了我的代码吗？但是，如果您有可以进行表单验证的教程。对于本土的反应，这将是一个很好的研究。我是这项技术的新手。

Answer 1

这是关于你的第一个渲染，它找不到todoText。因为它在constructor中的首字母是错误的。将constructor更改为此：

constructor(props:TodoProps){
    super(props);
    this.state = {
      todoText:" "
    };
}

无法在本机中读取null属性字符串

1 个答案: