Question

嗨，我已经在React Native中为我的设置页面构建了一个列表组件。我希望设置页面上的每个组件都具有功能（在某些情况下没有）。

我用array创建了一个objects，在其中放置了每个项目属性。

 const list = [
            {
              title: 'Change user settings',
              icon: 'account-circle',
              link: 'UserEdit',
              action: this.noFunction()
            },
            {
              title: 'Logout',
              icon: 'exit-to-app',
              link: 'Auth',
              action: this.sessionFunction()
            },
        ]

现在，我有两个列表项，每个列表项都将自己的功能应用于其action属性。

当我在应用程序中按一个listItem时，它将调用这两个函数。

但是我只希望应用与应用程序相关的功能。

我该怎么做？而我的代码中是什么导致此错误的呢？

      noFunction(){
        console.log('noFunction')
      }

      sessionFunction =() => { 
        console.log('sessionFunction')
        this.deleteSession().then(() => {
          this.props.destroySession();
        })
      }

    render(){ 
        const list = [
            {
              title: 'Change user settings',
              icon: 'account-circle',
              link: 'UserEdit',
              action: this.noFunction()
            },
            {
              title: 'Logout',
              icon: 'exit-to-app',
              link: 'Auth',
              action: this.sessionFunction()
            },
        ]
        return (
            <View>
                {
                    list.map((item, i) => (
                    <ListItem
                        key={i}
                        title={item.title}
                        leftIcon={
                            { name: item.icon }
                        }
                        onPress={() => {
                          item.action
                          this.props.navigation.navigate(item.link)
                          }}
                    />
                    ))
                }
            </View>
            )
        }

    }

Answer 1

只需从功能中删除()。

当您有类似action: this.noFunction()之类的内容时，您正在执行该函数并将其分配给action，因此foo.action将是noFunction调用返回的值（在您情况下，未定义，因为noFunction不返回任何内容。

如果您像action: this.noFunction一样传递它，则仅将引用传递给该函数，以后您可以执行foo.action()并调用noFunction。

Answer 2

您需要删除调用表达式()。

为什么列表项不应该调用函数？

2 个答案: