基于mpVue写了一个企业运营管理项目

前言

接近两个月没有更新博客了，上一个月一直在写一个小程序的项目，因为本人一直都是写vue也没怎么写过小程序，所以在网上看了看发现了一个mpvue这个框架发现可以用h5和vue写小程序果断看了一天，然后运用在项目中了！废话不多说，在这里说一说在实际开发中的一些坑。

基本配置

这里就不多说基本配置了官方都有点击这里！

组件中的生命周期

我们都知道vue的生命周期函数，小程序也有他的生命周期函数！在mpvue里面我们都可以用！没错是都可以用，这个位置就是一个坑！我是在这样的业务场景发现有这样一个坑。。。

本人做的这个项目有七个管理栏目每个栏目中有相同样式的列表也和详情页，少部分也存在编辑新增！我将七个栏目列表共用了一个页面。七个详情分别写了七个组件，我是根据页面路径传递不同的参数通过if判断实现的。在这里组件里面就存在一个问题，vue的钩子函数只会执行第一次（created和mounted），后续无论多少次进入是没办法执行的。然而小程序中的（onload和onshow）则是第一次不会执行后续再进入就会执行！在这里我是通过同时调用两边的钩子函数来避免这个问题的！

编辑新增刷新数据

在栏目里面有些数据是会有编辑和新增的，这里有一个功能就是编辑/新增完成之后需要刷新数据。由于新增/编辑是另外的一个页面算是返回之后刷新在这里为了良好的用户体验、以及完成新增/编辑完成之后才刷新这个业务，我用了小程序里面的一个方法getCurrentPages()
这个函数可以获取当前页面栈的实例，以数组形式按栈的顺序给出，第一个元素为首页，最后一个元素为当前页面。

mounted() {
  let _this = this;
  let pages = getCurrentPages();
  _this._2Page = pages[pages.length - 2]
  _this._3Page = pages[pages.length - 3]
  _this.isShow = true
},
onShow() {
  let _this = this;
  let pages = getCurrentPages();
  _this._2Page = pages[pages.length - 2]
  _this._3Page = pages[pages.length - 3]
}

这里大家肯定会有疑问为啥要调用两次还是分别在vue的钩子函数中和小程序钩子函数中；答案就是我上面提到的那个问题！

这里刷新数据就是通过他获取上级以及上上级页面的参数在编辑成功后执行上级或者上上级的钩子函数完成刷新页面！

一些ui框架的组件初始化的问题

这个项目中我用了很多ui组件毕竟项目紧就一个月…这里就有一些组件初始化的问题，比如通知栏这个组件。由于，通知的消息是后台获取的，所以这里有一个循环滚动这个属性没有生效。这里，我是用的if给他先隐藏然后再他获取消息成功之后在显示，这样就没问题啦~

最后

因为本项目已经上线涉及保密不能给大家源码！这些如果能帮助大家是最好的，记得star我哟！