Javascript 映射时将props参数传递给React.js中的函数

当我在组件渲染方法中通过道具进行映射时，我可以将道具值传递给函数。我忘记了正确的方法。例如，我有一个category tag控件，它只列出一些带有名称的类别，但是单击后我想为单个类别执行一些功能

var React = require("react");

var CategoryTags = React.createClass({

  propTypes: {
    categories: React.PropTypes.array.isRequired
  },

  render: function() {

      var categoryRows = this.props.categories.map(function (c, i) {

        return (
            <button onClick={ this.linkToCategory.bind(name) } >
              {c.name}
            </button>
        );

      }.bind(this));

    return (
        <span>{categoryRows}</span>
    );

  },

  linkToCategory: function (c) {
    console.log(c);
  }

});

var React=require（“React”）；
var CategoryTags=React.createClass({
道具类型：{
类别：React.PropTypes.array.isRequired
},
render:function（）{
var categoryRows=this.props.categories.map（函数（c，i）{
返回(
{c.name}
);
}.约束（这个）；
返回(
{categoryRows}
);
},
链接类别：功能（c）{
控制台日志（c）；
}
});

因此，在本例中，在映射类别时，我希望传入单个类别的名称，以便解析链接。当然，对象具有link属性是有意义的，但在本例中没有

传递到组件道具的categories对象示例

---

categories=[{'name'：'cat1'}，{'name'：'cat2'}]
在
.map
中绑定函数不是一个好主意，因为您总是要将新函数传递给组件，即使其他属性没有更改。这意味着它将始终被重新渲染，即使它不必被重新渲染

但是无论如何，你的代码的问题是

没有变量
名称
您使用的
.bind
不正确
电话应该是

this.linkToCategory.bind(this, c.name)

传递给bind
.bind
的第一个参数是
this
的值，而不是第一个参数（您应该知道，因为您正在使用
.bind（this）
）

您可以在中了解有关
.bind
的更多信息。
您还可以从事件处理程序返回函数：

var CategoryTags = React.createClass({

  propTypes: {
    categories: React.PropTypes.array.isRequired
  },

  render: function() {

      var categoryRows = this.props.categories.map(function (c, i) {

        return (
            <button onClick={this.linkToCategory(c)} >
              {c.name}
            </button>
        );

      }.bind(this));

    return (
        <span>{categoryRows}</span>
    );

  },

  linkToCategory: function (c) {
      return () => {
          console.log(c);
      }
  }

});

var CategoryTags=React.createClass({
道具类型：{
类别：React.PropTypes.array.isRequired
},
render:function（）{
var categoryRows=this.props.categories.map（函数（c，i）{
返回(
{c.name}
);
}.约束（这个）；
返回(
{categoryRows}
);
},
链接类别：功能（c）{
return（）=>{
控制台日志（c）；
}
}
});
谢谢，这是.bind方法中的一个输入错误，我把它作为
.bind（c.name）
使用，但是我忘记了将
这个
作为第一个参数传入。是否有任何React文档说明在通过道具映射时需要调用函数时如何避免重新渲染，或者另一种方法？我所做的只是创建另一个接受回调的组件。例如，您可以拥有自己的按钮组件，它接受
name
和
onClick
处理程序作为prop，并在单击按钮时将
name
prop传递给处理程序。