由于页面 JS 也继承自 Component 组件基类,所以页面同样拥有生命周期,页面的生命周期方法如下:

componentWillMount()

页面加载时触发,一个页面只会调用一次,此时页面 DOM 尚未准备好,还不能和视图层进行交互

componentDidMount()

页面初次渲染完成时触发,一个页面只会调用一次,代表页面已经准备妥当,可以和视图层进行交互

shouldComponentUpdate(nextProps, nextState)

页面是否需要更新,返回 false 不继续更新,否则继续走更新流程

componentWillUpdate(nextProps, nextState)

页面即将更新

componentDidUpdate(prevProps, prevState)

页面更新完毕

componentWillUnmount()

页面卸载时触发,如 redirectTo 或 navigateBack 到其他页面时

componentDidShow()

页面显示/切入前台时触发

componentDidHide()

页面隐藏/切入后台时触发, 如 navigateTo 或底部 tab 切换到其他页面,小程序切入后台等
在以上所有的生命周期方法中,都可以通过 this.$router.params 获取打开当前页面路径中的参数