[REACT] state

index.js

import React from 'react'
import ReactDOM from 'react-dom'
import App from './App'

ReactDOM.render(<App></App>,document.getElementById('root'))

App.js

import React, { Component } from 'react'

export default class App extends Component {
  constructor(props){
    super(props)
    this.state={
      msg1:'im msg1',
      count:0
    }
  }
  componentDidMount(){
    this.setState({
      count:this.state.count+1
    },()=>{
      console.log("后输出",this.state.count)
    })
    console.log("先输出",this.state.count)

  }

  render() {
    return (
      <div>
        <h1>{this.state.msg1}</h1>
        <h2>{this.state.count}</h2>
      </div>
    )
  }
}

import React, { Component } from 'react'

export default class ConditionLoop extends Component {
    constructor(props){
        super(props)
        this.state={
            flag:true,
            goods:[
                { id:1,name:"joker1" },
                { id:2,name:"joker2" },
                { id:3,name:"joker3" },
                { id:4,name:"joker4" }
            ]
        }
    }
    showTitle=()=>{
        this.setState({
            flag:false
        })
    }
    render() {
        return (
            <div>
                <ul>
                    {
                        this.state.goods.map(good=>{
                            return <li key={good.id}>
                                <span>{good.id}</span>
                                <span>{good.name}</span>
                            </li>
                        })
                    }
                </ul>
                <button onClick={this.showTitle}>不显示button</button>
                {this.state.flag?"111":"222"}
            </div>
        )
    }
}