1.mpvue用vue init的方式初始化的基本结构中，假设版本为1.0.0的版本，会有扩展运算符失效(报错)的问题，在1.0.1的版本中已经解决了次问题。一般情况下可以升级mpvue的版本至1.0.1，同样的mpvue-loader、mpvue-template-compiler等都要升级，这里不建议用户自己一个个去升级，因为总会难免出现纰漏，建议直接init新版本的结构进行使用。这里说一个被我升级过程中遗忘的问题，就是当你要升级对应的依赖的时候，去你的page.json去删掉对应的配置信息，不然安装依赖的时候会按照你的配置信息去下载对应的版本。这里普及一点对npm指令不太熟悉的几个小点 -D : --save-dev （不参与项目打包） -S : --save
举个例子：
// 安装css-loader 和 style-loader
// 为啥安装css-loader 和style-loader ？css-loader: 加载.css文件，style-loader:使用<style>将css-loader内部样式
// 注入到我们的HTML页面
cnpm install --save-dev style-loader css-loader
同样的，如果想在你的项目组件中写入less语法的样式或者外部引入less文件，你也需要安装loader去添加webpack对less的支持。注意:建议在安装less-loader的同时也去安装css+style的loader
cnpm install less,less-loader --save-dev
这里有两种情况的建议引用方式
情况一: 在特定组件中引用
image.png
情况二：在全局中进行引用
image.png
第二个问题就图片了
我们在项目中肯定会使用图片，这里建议大家把图片放到我们的static目录下，引入图片的时候以dist的为准
image.png
不过一般说起来，在开发过程中应该是不用担心这个问题的，只是怕个别情况会这样，所以在这里提个醒。因为在1.0.0的时候引入tabBar里面的图片会有这个问题。
这里说一个场景值的问题。我们知道'原生小程序'里面的周期函数可以拿到一些场景值，直接在周期函数中传参就可以拿到，在我们的mpvue框架中也可以拿到，只不过方式要改变一下，这里我直接截图了官方的介绍
image.png
因为这个经常被新的伙伴们忽略，所以我这里重点提醒一下
这里使用过vue的伙伴们会使用绑定属性的方式去给一个标签绑定一个类名，在vue中我们一般使用三元表达式去做这个事情，但是在版本 1.0.0-1.0.1的时候，这个写法是不被支持的，所以在这俩版本里推荐使用computed的写法去做这个事情。请看下面对应写法以及编译结果截图
image.png
这里说个需要注意的地方，原来在mpvue版本(1.0.0-1.0.2)中是不支持在类中写三元表达式的，但是在版本1.0.3已经修复了这个问题，所以推荐我们可以愉快的这么写
<div class="cc" :class="1===1?'cOne':'cTwo'">
test class
</div>
现在很多开发人员都会用Mock.js去模拟我们的接口数据以便前后端分离开发的时候，不用等待后端的数据，自己就可以先模拟数据完成开发。不知道Mock是啥的同学请自己去看github上的文档哈，这里我们不赘述。
下面看代码
let Mock = require('mockjs')
let data = Mock.mock({
'dataArr|5': [{
'id|+1': 1,
'name': '@name'
}]
})
return data.dataArr
上面的代码中在我们的其他项目中是可以正常运行的，但是在mpvue中会报个语法错，所以我们要加点小东西，请看代码
let Mock = require('mockjs')
let data = Mock.mock({
'dataArr|5': [{
'id|+1': 1,
'name': '@name(true)'
}]
})
return data.dataArr
这样就不会报错了，这里感谢我们的网友@军的贡献。
这里记录一点区分
在我们的原生事件中，事件处理函数可以传一个event参数，这个参数里面有我们的事件信息。事件信息是一个对象，在这个对象里面包含了一个很有用的东西 - detail 。比如一个表单提交组件中点击提交的时候，我们可以在对应事件函数的事件对象中拿到表单里面的信息，具体例子请看这里 : https://mp.weixin.qq.com/debug/wxadoc/dev/component/form.html 和 https://mp.weixin.qq.com/debug/wxadoc/dev/component/radio.html 。如果你仔细观察的话，可以看到基本和value有关的组件都是可以这么用的，在detail中可以拿到当前组件的 输入/选中 的值。
在我们的mpvue中，对这一点做出了一些不一样的封装
image.png
在mpvue中，我们得用@ 去替换我们的 bind。然后我们去看下打印结果
image.png
细心的你会发现，detail 替换 成了 target ，所以这点是一定要记住的，不然自己被自己坑了，找谁说理去。
网友评论