在学习访问性之前,先回顾一个小知识点——解构赋值
var {name,age} = {name:'xiao',age:18}
console.log({name}); //{name:'xiao'}
console.log({age}); //{age:18}
接着继续。。。
语义化的HTML
/**
* Created by mapbar_front on 2019/7/23.
*/
import React,{Component,Fragment} from 'react';
function ListItem({item}){
return <Fragment>
<dt>{item.name}</dt>
<dd>{item.age}</dd>
</Fragment>
}
class Accessibility extends Component{
constructor(props){
super(props);
this.state = {
data:[
{
id:101,
name:'tianxia',
age:18,
},{
id:102,
name: 'xiao666',
age:22,
}
]
}
}
render(){
return(
<div>
<dl>
{
this.state.data.map((item,i)=>{
return <ListItem key={item.id} item={item}/>
})
}
</dl>
</div>
)
}
}
export default Accessibility;