Fragment

2020-06-11  本文已影响0人  skoll

一个包装容器

// 添加片段
import React from 'react'

class Fragments extends React.PureComponent{
     constructor(props){
        super(props)
        this.state={
            item:[1,2,3,4]
        }
     }
     render(){
         
         return (
            //  <React.Fragment>
            //      <div>1</div>
            //      <div>2</div>
            //      <div>3</div>
            //  </React.Fragment>

            // 简写
            // <>
            //     <div>1</div>
            //     <div>2</div>
            //     <div>3</div>
            // </>

            // key是唯一支持传入的属性  
            <>
                {this.state.item.map(item=>(
                    <React.Fragment key={item}>
                        <span>{item}</span>
                        <h1>这是另一个---></h1>
                    </React.Fragment>
                ))}
            </>

         )
     }
}

export default Fragments
上一篇下一篇

猜你喜欢

热点阅读