import React, { Component } from 'react';
import './style.css'
class App extends Component {
constructor(props) {
super(props);
this.state = {
condition:true // 状态(隐藏或显示)
// 切换隐藏或显示状态
toggle=()=>{
this.setState(()=>({
condition:this.state.condition?false:true
render() {
return (
{/* 根据状态决定显示或隐藏的类名 */}
<div className={this.state.condition?'show' :'hide'}>hello</div>
<button onClick={this.toggle}>切换</button>
export default App;
.show {
opacity: 1;
transition: all 1s;
.hide {
opacity: 0;
transition: all 1s;