react native的onpress问题

Question

代码如下

export default class app extends Component {
    state={
        name:''
    }
    render(){
        return(
            <View>
                <TextInput onChangeText={this.handle}></TextInput>
                <TouchableOpacity
                     onPress={this.handleSubmit(this.state.name)}>
                     <Text>提交</Text>
                </TouchableOpacity>
            </View>
        )
    }
    handle=(text)=>{
        this.setState({name:text})
    }
    handleSubmit=(name)=>{
        alert(name)
    }
}

问题：这样写的话每次输入文本都会调用handleSubmit函数，这是为什么

<TouchableOpacity
        onPress={()=>this.handleSubmit(this.state.name)}>
        <Text>提交</Text>
</TouchableOpacity>

这样写可以不触发，但是。。。为什么？？

Answer 1

每次setState都会重新执行render函数，由于this.handleSubmit(this.state.name)是函数执行的形式，所以每次setState都会调用这个函数

Answer 2

onPress 要求是传入一个函数。

onPress={this.handleSubmit(this.state.name)}>

你上述这样写其实是将handleSubmit函数的执行后的返回值undefined赋值给了 onPress。
每次输入都会更改state，触发render，jsx语句重新解释编译运行，每次都会执行上述逻辑；
改成下面的写法就行了：

handleSubmit=(name)=>()=>alert(name)