我在以下URL处有代码:https : //gist.github.com/motleydev/6d5e980e4d90cc5d52fd,在此构建标签类型设置。有一行选项卡,一部分内容,然后是另一行图像,这些状态具有交替的活动状态,具体取决于哪个选项卡是“打开的”。我最终需要做的是能够单击选项卡的索引,但是我似乎无法找出一种好的方法。我需要的只是整数。赞赏任何见识。谢谢!
Jorum解决方案有效。
您还可以替换:
handleClick: function(event){ event.preventDefault(); console.log(this); }, render: function(){ var self = this; var tabs = this.props.tabs.map(function(tab,index){ var clickHandler = self.handleClick; return (<li key={'tab'+index}><a ref={'tab'+index} href="#" onClick={clickHandler} > {tab.meta.title}</a></li>) }); return ( <nav> <ul> {tabs} </ul> </nav> ) } });
通过:
handleClick: function(index){ event.preventDefault(); console.log(this); }, render: function(){ var self = this; var tabs = this.props.tabs.map(function(tab,index){ var clickHandler = self.handleClick.bind(null,index); return (<li key={'tab'+index}><a ref={'tab'+index} href="#" onClick={clickHandler} > {tab.meta.title}</a></li>) }); return ( <nav> <ul> {tabs} </ul> </nav> ) } });