代码之家 › 专栏 › 技术社区 › Marcel

在render()中使用args调用函数表达式-react native

render expression react-native function reactjs

1

Marcel · 技术社区 · 7 年前

所以我读了 this article Atinder Singh介绍了如何加快react原生应用程序的6种方法。

太长,读不下去了 “尽早绑定,不要在render中创建函数。执行以下操作:

constructor(props) {
    super(props);
    this.doWork = this.doWork.bind(this);
  }
doWork() {
    // doing some work here.
    // this.props.dispatch....
  }

  render() {
    return <Text onPress={this.doWork}>Do Some Work</Text>
  }

}

不是

<Text onPress={ () => this.doWork() }>Do Some Work</Text>

或

<Text onPress={ this.doWork.bind(this) }>Do Some Work</Text>

因为经常调用render,并且每次执行上述两项操作中的任何一项时,都会创建一个新函数。“-2017年10月13日

在我的环境中 this.doWork 对每个渲染调用get。所以我改成 const doWork = () => {...} 工作正常。但是我如何使用参数调用fct?当我这样做的时候 this.doWork(x, y) ,每次渲染都会再次调用fct get。

有没有一种有效的方法可以在每次渲染都不创建新的fct的情况下调用此fct? 非常感谢你的帮助!

1 回复 | 直到 7 年前

1

Community CDub 5 年前

1、是否有一种有效的方法可以调用此fct,而不必在每次渲染时创建新的fct?

2、但如何使用参数调用fct? ,

您可以使用 function currying

doWork = (param) =>(e)=>{

    console.log('Event', param);
};

内部渲染:

 render(){
         return <Text onPress={this.doWork('someHardValOrProp')}>Do Some Work</Text>
    }

工作 React#codesandbox 实例