REACT_react动态修改页面title，自定义文档头

方法一

在 componentDidMount 为 document.title 赋值

componentDidMount() {
    
    
	document.title = this.props.title
}

注意：不能在 render() 函数中为 document.title 赋值，因为 render() 执行时还没有真正的DOM，所以无法获得 document 对象。

方法二

https://www.npmjs.com/package/react-document-title
安装

npm install --save react-document-title

引入

import DocumentTitle from 'react-document-title'

使用

return (
	<DocumentTitle title='English'>
		<h1>English</h1>
	</DocumentTitle>
)

方法三

https://www.npmjs.com/package/react-helmet
react-helmet，官网的解释是：这个可复用的react组件将管理你在文档头的所以更改。它你可以定制你的页面title
安装

npm install react-helmet --save

import React from 'react';
import {
    
    Helmet} from 'react-helmet';
 
class Application extends React.Component {
    
    
	render () {
    
    
	    return (
	        <div className="application">
	            <Helmet>
	                <meta charSet="utf-8" />
	                <title>My Title</title>
	                <link rel="canonical" href="http://mysite.com/example" />
	            </Helmet>
	            ...
	        </div>
	    )
	}
}

特性：

1，支持所有有效的头标签，title base meta link script noscript style
2，支持body html title标签的属性
3，支持服务端渲染
4，嵌套组件重写重复的头改变