javascript - 在 reactjs 中使用渲染方法之外的函数

Question

我有这样的代码:

//我的文件.js

var React = require('react');
var ReactDom = require('react-dom');
var App = React.createClass({
    getInitialState:function(){
        return {//something};
    },
    myFunction:function(html){
        //some code
    },
    render:function(){
        //some code
        var someVar1, someVar2, someVar3;
        someVar1.map( function(i, j){
            someVar2.campos.map( function(k, j){
                someVar3.campos.map( function(z, k){
                    this.myFunction(something);
                }
            }
        }
        return (
            <div>
                { //something }
            </div>
        );
    }
});
module.exports=App;

my_file.js:16 未捕获类型错误:this.myFunction 不是一个函数。我做错了什么？我如何在渲染器中使用该函数？

Answer 1

问题是在 .map 中 this 指的是全局范围而不是你的组件。有几种方法可以解决这个问题

1. 为每个.map设置this

   someVar1.map( function(i, j){
     someVar2.campos.map( function(k, j){
       someVar3.campos.map( function(z, k){
         this.myFunction(something);
       }, this);
     }, this)
   }, this)
   

2. 在变量中存储this

   var self = this;
   someVar1.map( function(i, j){
     someVar2.campos.map( function(k, j){
       someVar3.campos.map( function(z, k){
         self.myFunction(something);
       });
     })
   })
   

3. 使用箭头函数

   someVar1.map( (i, j) => {
     someVar2.campos.map( (k, j) => {
       someVar3.campos.map( (z, k) => {
         this.myFunction(something);
       });
     })
   })