1使用箭头函数 ,this指向向上指就拿到了
2:使用bind,改变this指向
import Lottie from 'lottie-web'
import React from "react";
import * as Menu from './json/menu.json'
export default class MenuLottie extends React.Component {
constructor(props: NonNullable<unknown>) {
super(props)
this.state = {
menuL:null
}
}
componentDidMount() {
const menuL = Lottie.loadAnimation({
container: document.getElementById('menu-lottie') as Element,
renderer: 'svg',
loop: false,
autoplay: false,
animationData:Menu
})
this.setState({
menuL:menuL
})
}
// 写法1
// openMenu(){
// console.log(this.state,24)
// }
// 写法2
openMenu = () =>{
console.log(this.state,24)
}
render() {
// 写法1
// return <div id="menu-lottie" onClick={this.openMenu.bind(this)}/>
// 写法2
return <div id="menu-lottie" onClick={this.openMenu}/>
}
}