react和vue父子組件生命週期的執行順序

react：父組件將要掛載（componentWillMount）
            子組件將要掛載（componentWillMount）
            子組件掛載完畢（componentDidMount）
            父組件掛載完畢（componentDidMount）

import React, { Component } from "react";
class Test extends Component {
  componentWillMount() {
    console.log("子組件將要掛載");
  }
  componentDidMount() {
    console.log("子組件掛載完畢");
  }
  render() {
    return <p>{this.props.index}</p>;
  }
}

export default class TestPanel extends Component {
  componentWillMount() {
    console.log("父組件將要掛載");
  }
  componentDidMount() {
    console.log("父組件掛載完畢");
  }
  render() {
    return (
      <div>
        <Test index={1} />
        <Test index={2} />
        <Test index={3} />
      </div>
    );
  }
}

vue：

 

Vue單組件與父子組件的生命週期參考：https://www.jianshu.com/p/1599901cf9a5