react列表

渲染多个组件

import React,{Component} from 'react'

function NumberList () {
  const numbers = [1,2,3,4,5]
  const listItems = numbers.map(number => 
{number*2}
 )
  return (
{listItems}
)
}
function ListItem (props) {
  const value = props.value
  return(
    
{value}
  )
}
function NumberList1 (props) {
  const numbers = props.numbers
  const listItems = numbers.map(number => )
  return (
    

      {listItems}
    
  )
}
export default class List extends Component{
  render(){
    return (
      

        
react列表&key
        
      
    )
  }
}

经过上述代码执行，可以知道如果将key的值放在li上，或者不给key值，控制台会报错，当给了key值并且将key绑定在提取的组件上，就不会有报错了。