关于mpvue的几个点
微信小程序的框架众多,而现在我只想记录一下mpvue的几个点...祝你采坑成功。 微信小程序在语法规范、API、组件外,因为多了个可组件化component,主要点始终落在app.json、app.wxss、app.js和每个页面和组件的配置上,都是相似雷同的事情,详情移步官方文档 相对而已,mpvue是在vue基础上加入了微信小程序的支持,在loader和编译方面多做支持,编码规范以vue为标准。 使用现在已vue-cli生成mpvue/mpvue-quickstart模板深入 相对于原生小程序,mpvue在代码目录主要维护:
配置每页导航栏信息找到每页的的main.js,添加export default对应内容
网上说这是设置每页navigation内容和状态的方法,亲试不行 暂时可以替代的方法: wx.setNavigationBarTitle({
title: '关卡'
})
FAQS报错mpvue 未找到入口 app.json 文件正常情况: npm run dev 执行一下mpvue的编译 在dist目录下会自动产生一个app.json 题外话:安装依赖包的时候或者npm run dev的时候提示缺少依赖的话,直接把node_modules 下面的文件全部删掉,然后重新npm intall 简单粗暴解决问题 分析: 因为缺乏依赖而没自动生成app.json 解决之道: 只需要把packpage.json里的mpvue-loade后面的‘^’去掉,重新安装依赖即可。 npm install
npm run dev
npm run dev 无法编译成功情况如下: $ npm run dev
> color-life@1.0.0 dev /home/happy/Dev/coding/color-life
> node build/dev-server.js
尝试如下也无法解决: 1.npm run dev不行
2.删除module重装也不行
3.重新初始化项目也不行
这主要是编译时遇到代码缺失 解决: 如果有组件只有纯template,加上即可: <script>
export default {}
</script>
v-show使用失效分析v-show的特点:
使用v-show时,很容易将v-show直接下载创建的组件上,如 <template>
<components v-show="isShow"></components>
</template>
因此组件的显隐状态无法根据isShow响应状态 只需要在组件外包括一层元素进行控制 科普:v-if直接是创建-销毁组件 |