美文网首页
#7 打开和关闭电脑

#7 打开和关闭电脑

作者: 康乐芳华 | 来源:发表于2017-12-18 17:10 被阅读0次

完成两个组件,电脑 Computer 和显示器 Screen

电脑有个 status 状态表示电脑现在是开还是关的,statuson为开,statusoff 为关,默认状态为 off。电脑有个按钮,点击可以自由切换电脑的开关状态。

显示器接受一个名为 showContentprops,显示器会把它内容显示出来。如果不传入 showContent,显示器显示 “无内容”。

电脑包含显示器,当电脑状态为开的时候显示器显示“显示器亮了”,否则显示“显示器关了”。

class Computer extends Component {
  constructor(){
    super()
    this.state = {
      status: 'off'
    }
    this.switchit = this.switchit.bind(this)
  }
  switchit(){
    if(this.state.status === 'on'){
      this.setState({
        status: 'off'
      })
    }else{
      this.setState({
        status: 'on'
      })
    }
  }
  render () {
    return (
      <div>
        <button onClick={this.switchit}>开关</button>
        <Screen showContent={this.state.status} />
      </div>
    )
  }
}

class Screen extends Component {
  static defaultProps = {
    showContent: '无内容'
  }
  render () {
    let sign = this.props.showContent
    let con = sign === 'on'? '显示器亮了':'显示器关了'
    return (
      <div className='screen'>{con}</div>
    )
  }
}

相关文章

  • #7 打开和关闭电脑

    完成两个组件,电脑 Computer 和显示器 Screen。 电脑有个 status 状态表示电脑现在是开还是关...

  • MySQL基础操作

    打开MySQL我的电脑 -> 管理 -> 计算机管理 -> 服务和应用程序 -> MySQL 打开 关闭MySQ...

  • 关闭和打开

    写作学习群里有伙伴谈到关闭了朋友圈,效果很不错。我观望了好多天没有行动,心里想去试试关了会是什么情况,已形...

  • Linux防火墙配置

    Centos 7和 Centos 6开放查看端口 防火墙关闭打开 Centos 7 firewall 命令: 查看...

  • MC大冒险剧场版预告

    又是一个清晨,我打开电脑,玩了一会儿我的世界。可是,当我关闭电脑的时候,电脑上显示:因某种故障,电脑以无法关闭,再...

  • Win7下建立FTP服务器

    1.启动电脑FTP功能 打开控制面板->程序和功能左边的“打开或关闭Windows功能”,选中Internet信息...

  • 怎样快速关闭电脑与手机和快速启动电脑与手机。

    怎样快速关闭电脑与手机和快速启动电脑与手机。 99%的人不知道怎样快速关闭电脑和关闭手机。有些人可能长时间不关闭电...

  • Linux配置IP、连接网络

    配置IP,连接网络 一、window电脑的防火墙关闭 开始 -》控制面板 -》防火墙 -》打开或关闭 -》关闭防火...

  • 打开和关闭文件

    打开文件$ exec 200>/tmp/lock_file以写的方式打开文件,文件句柄是200$ exec 200...

  • 打开和关闭文件

    打开文件的方式具体如下图所示(来自于https://fishc.com.cn/thread-90808-1-1.h...

网友评论

      本文标题:#7 打开和关闭电脑

      本文链接:https://www.haomeiwen.com/subject/ltvmwxtx.html