时间戳

首页 > 解决方案 > 如何在 for 循环中调用 onPress 函数。在本机反应

javascript - 如何在 for 循环中调用 onPress 函数。在本机反应

问题描述

我是新来的反应本地人。我有 3 个功能

function1()
function2()
function3()

我想在单个按钮 onPress 上多次运行这 3 个功能。当用户点击第四次时，应该再次运行第一个功能，依此类推。

这是我尝试过的。但我一直保持低于 4 的红线和这样的错误 = Identifier expected.ts(1003)

for (let i = 0; i < 4; i++) {
            <Icon onPress={this.function[i]}/>
          }

请帮助最好的方法是什么

标签： javascriptreact-nativefor-loop

解决方案

您可能需要像这样为 Icon 分配一个 key prop：

<Icon key={i} onPress={this.function[i]} />

在 React 中，任何迭代的组件都必须有一个 key prop，尤其是在映射数组时。我想for循环应该是一样的。

更新：如果你循环 Icon 组件，它会渲染多次。但我猜你只想点击一个图标组件。然后你可以使用状态来迭代函数。

<Icon onPress={() => {
    this.function[i]
    if (i === 3) this.setState({ i: 1 })
    else this.setState({ i: i + 1 })
}} />

不要忘记在 render() 函数之外添加这个状态语句：

state = { i: 1 }

推荐阅读