时间戳

首页 > 解决方案 > 无法在本机 0.61.1 中创建渲染之外的函数

reactjs - 无法在本机 0.61.1 中创建渲染之外的函数

问题描述

我刚刚创建了新的 react native 应用程序并尝试创建 TouchableOpacity 的函数和 console.log onpress，但它给出了未定义 functionName 的错误。

这是我的代码：

import React, { Component } from 'react';
import { Text, View, ScrollView, StyleSheet, TouchableOpacity } from 'react-native';

export default class Home extends Component {


    functionName = () => {
        console.log('function called');
    }


    render() {
        return (
            <ScrollView contentContainerStyle={styles.container}>
                <TouchableOpacity onPress={functionName()}>
                    <Text> Home {sliderApi} </Text>
                </TouchableOpacity>
            </ScrollView>
        )
    }
}

但是当我将 functionName 放入 render 方法时，它工作正常。

标签： reactjsreact-native

解决方案

代替

<TouchableOpacity onPress={functionName()}>

和

<TouchableOpacity onPress={this.functionName}>

或与

<TouchableOpacity onPress={() => this.functionName()}>



仅供参考： {this.functionName} 和 {() => this.functionName()} 之间没有区别。使用箭头函数“() =>”的原因是我们使用括号 ()调用函数，例如“this.functionName()”。当我们用括号 ()调用函数时，它将在代码执行时直接调用。但是，当我们只想在“TouchableOpacity 或任何组件”的“onPress 或任何事件”触发时调用该函数时，我们必须将它与箭头函数“() =>”一起使用，或者我们只需要像“this.functionName”一样调用它”。

推荐阅读