A declarative, nested, stateful document.title for React
npm install react-document-title-szReact Document Title
====================
Provides a declarative way to specify document.title in a single-page app.
This component can be used on server side as well.
Built with React Side Effect.
``
npm install --save react-document-title
Dependencies: React >= 0.13.0
* Does not emit DOM, not even a
Assuming you use something like react-router:
`javascript
function App() {
// Use "My Web App" if no child overrides this
return (
);
}
function HomePage() {
// Use "Home" while this component is mounted
return (
Home, sweet home.
);
}
class NewArticlePage extends React.Component {
constructor(props) {
super(props);
this.state = { title: 'Untitled' };
}
render() {
// Update using value from state while this component is mounted
return (
New Article
onChange={(e) => this.setState({ title: e.target.value })}
/>
);
}
}
`
If you use it on server, call DocumentTitle.rewind() after rendering components to string to retrieve the title given to the innermost DocumentTitle. You can then embed this title into HTML page template.
Because this component keeps track of mounted instances, you have to make sure to call rewind` on server, or you'll get a memory leak.
Looking for something more powerful? Check out React Helmet!