mpvue 注意事项

官方文档 ： http://mpvue.com/mpvue/

 

mpvue采坑

1. Cannot assign to read only property 'exports' of object '#<Object>' 编译报错

这是因为引用第三方插件的时候,带入了module.exports的写法,webpack可以使用require和export ，但是不能混合使用import 和module.exports,你需要做的是更新根目录下的.babelrc文件配置

https://blog.youkuaiyun.com/u013034736/article/details/70174425

 

2. 引入全局的prototype属性

  a. 在根目录的main.js文件中加入引用

import wxUtils from "./utils/wxUtils"
Vue.prototype.$sys = wxUtils

 b. 文件的写法必须采用 export default的方式导出，不可以采用 定义一个const xx = {}  module.export = xx的方式导出

import logUtils from "./logUtils"

/**
 *    设置导航栏标题
 * @param title
 */
function setTitle(title){
  wx.setNavigationBarTitle({
    title: title,
  })
}

/**
 *   导航到页面
 * @param page
 * @param params
 */
function navigateTo(page,params){
  var url = '/pages/' + page + '/main?' + params
  logUtils.debug("url",url)
  wx.navigateTo({
    url: url,
  })
}

export default {
  setTitle,
  navigateTo,
}

4. 组件如果是tab切换的，为了保证下次进入能切换到指定位置，需要把tabIndex的修改放到点击后的回调里面去修改，该属性应该是个props属性，不应该设计为data属性

5. 所有的属性，不准直接用data的对象直接取值，必须通过计算属性来获取，所有字符操作必须校验

6. 新建组件的时候，最好去掉组件下的name,不要name的名字和组件文件名相同，否则会出现计算属性不执行的情况