mpvue学习

1.安装命令

npm init mpvue/mpvue-quickstart mpvue(这个mpvue是项目名)

安装完后

cd mpvue

npm install / cnpm install(建议用cnpm,快)

然后npm run dev(这里的这个命令与vue中有所不同,这个运行后会在当前项目下生成一个dist文件夹)

(Vuex看情况使用y,不使用n,ESlint我一般不开)

2.在微信开发者工具中导入项目

 到时候直接在VSCode(我用的写代码的工具)里写mpvue代码,微信小程序工具会跟着更新,如果不更新就重新npm run dev下

注意几点:

1.在mpvue里直接按照vue中的写法即可,但是也有一些地方不同,像vue-router mpvue中就不使用,跳转的话用switchTab(跳转到 tabBar 页面)或者navigateTo(跳转其他页面,不能跳到 tabbar 页面)

2.还有一些地方也需要使用小程序的api,比如请求使用wx.request

3.还有一些人看视频或者其他的会在main.js下修改标题栏(export default{config:{}}),最新的话现在是在main.json下修改。

4.还有解析html时可以使用v-html,但是效果不是很理想,比如img就不能控制大小,可以使用mpvue-wxparse,原生的里面有wxparse

mpvue-wxparse使用步骤(和组件引入使用一样):

①安装  npm i mpvue-wxparse --save  /  cnpm i mpvue-wxparse --save

②引入  import wxParse from 'mpvue-wxparse'

③注册组件  components:{wxParse}

④使用组件解析html    <wxParse :content="article" />(article为要解析的html

⑤别忘了引入css  @import url("~mpvue-wxparse/src/wxParse.css")

猜你喜欢

转载自www.cnblogs.com/bbplayer/p/11972977.html