import React, { Component } from 'react';
import './App.css'
class App extends Component {
  constructor(props) {
    super(props);
    this.state = { 
        show:true,
        text:'隐藏'
  render() { 
    return ( 
        <p className={this.state.show?'show':'hide'}>文字</p>
        <button onClick={this.toggle}>{this.state.text}</button>
  toggle =()=>{
    var show = this.state.show;
    var text = this.state.text;
    if(show){
      show =false
      text = '显示'
    }else{
      show = true 
      text = '隐藏'
    this.setState({
      show:show,
      text:text
export default App;

App.css

.show{
  opacity: 1;
  transition: .5s all ease-in;
.hide{
  opacity: 0;
  transition: .5s all ease-in;