reactjs 选项卡 初学

 每次学习一个语言我都喜欢写下选项卡

html 页面很简单 除了引入的那些必要的库之外 只有这一个

CSS  我只做了一个背景样式的改变

JS 我引用的 直接贴我JS 文件里边的代码

var Taba=React.createClass({
	getInitialState:function(){
		return{arr:[
			{"name":"tab1",
			"con":"第一个"},
			{"name":"tab2",
			"con":"第二个"},
			],
			key:0,
		
		}
	},
	handleClick(key,event){
		  this.setState({key:key});
		
		  
		
	},
	render(){
		var arrs =this.state.arr;
		var n =this.state.key
		var con=arrs[n].con
		return(
			

			{
				arrs.map((arr,i)=>{
					return(							
						{arr.name }		
						)
				})
			}
			
{con}
			
			
			)
	} 
})
ReactDOM.render(
	,
	document.getElementById("text")
	)

遇到的问题吧 都是一些小问题 

1  在return里边写 逻辑要加{}

2 在做MAP  循环的时候要再循环的DIV 上加 key{i} 要不然会报错               react.js:19287 Warning: Each child in an array or iterator should have a unique "key" prop. Check the render method of `Taba`. See https://fb.me/react-warning-keys for more information.
 3 在写class 样式的时候那个判断 我出了点问题 。

思路 

其实很简单就是鼠标单击的时候传入key 值 然后根据key 值去判断con 的内容是什么  也是由key 去判断 需不需要添加样式