plh97 / blog

✏️blog. writing in issues.
https://plhh.xyz/
82 stars 8 forks source link

[React] 高阶组件 #136

Open plh97 opened 5 years ago

plh97 commented 5 years ago

前言

很久没写文章了,这一次打算学习并介绍一次高阶组件

background

react 单页面应用,我需要在react-router-dom切换路由的时候,自动切换页面的title.希望能实现利用@autoTitle装饰器来实现这个功能.算是学习 react 第一步吧....

AutoTitle 的高阶组件

import React, { Component } from 'react';
const AutoTitle = title => (WrappedComponent) => class extends Component {
    constructor(){
        super()
        document.title = title
        super.componentDidMount && super.componentDidMount()
    }
    render(h) {
        return <WrappedComponent {...this.props}/>
    }
}
export default AutoTitle;