?componentWillReceiveProps(newProps)
?{
??? ?參數為給組件傳遞的參數
?}

componentDidUpdate(prevProps,prevState){
?? ?參數分別為改變之前的數據狀態對象
?? ?if(prevState.屬性名!=this.state.屬性名)
?? ?{
?? ??? ?...
?? ?}
}

import React, { Component } from 'react';
?
export default class Group extends Component {
? constructor(props) {
? ? super(props);
? ? this.state = {
? ? ? show: true,
? ? ? title: '大西瓜'
? ? };
? ? // 寫法一：事件綁定改變this指向
? ? this.showFunc = this.showFunc.bind(this);
? }
? // 調用該方法
? showFunc() {
? ? this.setState({
? ? ? show: false
? ? });
? }
? render() {
? ? let result = this.state.show ? this.state.title : null;
? ? return (
? ? ? <div>
? ? ? ? <button onClick={this.showFunc}>觸發</button>
? ? ? ? {result}
? ? ? </div>
? ? );
? }
}

import React, { Component } from 'react';
?
export default class Group extends Component {
? constructor(props) {
? ? super(props);
? ? this.state = {
? ? ? show: true,
? ? ? title: '大西瓜'
? ? };
? }
? // 第二種，通過箭頭函數改變this指向
? showFunc = () => {
? ? this.setState({
? ? ? show: false
? ? });
? };
? render() {
? ? let result = this.state.show ? this.state.title : null;
? ? return (
? ? ? <div>
? ? ? ? <button onClick={this.showFunc}>觸發</button>
? ? ? ? {result}
? ? ? </div>
? ? );
? }
}

import React, { Component } from 'react';
?
export default class Group extends Component {
? constructor(props) {
? ? super(props);
? ? this.state = {
? ? ? show: true,
? ? ? title: '大西瓜'
? ? };
? }
? // 調用該方法
? showFunc() {
? ? this.setState({
? ? ? show: false
? ? });
? }
? render() {
? ? let result = this.state.show ? this.state.title : null;
? ? return (
? ? ? <div>
? ? ? ? <button onClick={() => this.showFunc()}>觸發</button>
? ? ? ? {result}
? ? ? </div>
? ? );
? }
}