Reader small image

You're reading from  React Components

Product typeBook
Published inApr 2016
Publisher
ISBN-139781785889288
Edition1st Edition
Tools
Right arrow
Author (1)
Christopher Pitt
Christopher Pitt
author image
Christopher Pitt

Christopher Pitt is a principal developer for SilverStripe in Wellington, New Zealand. He usually works on open source software, though sometimes you'll find him building compilers and robots.
Read more about Christopher Pitt

Right arrow

Component life cycle methods


There are a couple of tricks I want to show you before we wrap up. The first is a life cycle method we can use to tell when a component's properties will change. We can use this to change the appearance of a component, or refresh the internal state.

We can add this method to PageEditor, for example:

class PageEditor extends Component {
    constructor(props) {
        super(props);

        this.state = {
            "changed": false
        };

        this.bind(
            "onCancel",
            "onUpdate"
        );
    }

    isChanged(next, previous) {
        return JSON.stringify(next) !== JSON.stringify(previous)
    }

    componentWillReceiveProps(props) {
        this.setState({
            "changed": this.isChanged(props, this.props)
        });
    }

    render() {
        return <div>
            <input
                type="text"
                name="title"
                value={this.props.title}
                onChange={this.onUpdate...
lock icon
The rest of the page is locked
Previous PageNext Page
You have been reading a chapter from
React Components
Published in: Apr 2016Publisher: ISBN-13: 9781785889288

Author (1)

author image
Christopher Pitt

Christopher Pitt is a principal developer for SilverStripe in Wellington, New Zealand. He usually works on open source software, though sometimes you'll find him building compilers and robots.
Read more about Christopher Pitt