A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

© charcoal 中级黑马   /  2021-4-18 09:27  /  5647 人查看  /  0 人回复  /   0 人收藏 转载请遵从CC协议 禁止商业使用本文

本帖最后由 charcoal 于 2021-4-19 18:37 编辑

1. 标签的区别:
uni使用小程序的标签,vue使用web端的标签
标签名变化的:



添加一点:vue中的div在小程序中使用view代替,出于降低h5应用向uni-app迁移成本的考虑,写成div、span也可以运行在app和小程序上,因为uni-app编译器会把这些HTML标签编译为小程序标签。但仍然建议养成新习惯

标签名未变的:
form, button,checkbox,label,textarea,video

不推荐使用的:
不内置audio标签,改成api方式由外部引入。
老的html标签是可以使用的,但为了兼容性,不做考虑。

css方面:
uni-app默认为rpx。

在uniapp中写后端接口的时候测试的时候,可以将校验合法域名给取消勾选,防止报错,但是上线的时候需要在微信小程序的开发平台,配置合法的域名。


2. 新增手机端常用组件

scroll-view:可区域性公董视图容器
swiper:可滑动区域视图容器
icon图标
rich-text:富文本
progress:进度条
slider:滑块指示器
switch:开关选择器
progress:进度条
camera:照相机
map:地图
cover-view:可覆盖原生组件的视图容器。 cover-view需要多强调几句,uni-app的非h5端的video、map、canvas、textarea是原生组件,层级高于其他组件。如需覆盖原生组件,比如在map上加个遮罩,则需要使用cover-view组件

3. js:

uniapp的api是参考小程序的,因而与浏览器端的api有所不同



cookie、session在uni不被支持
在不同客户端,支持条件编译,可以无限制使用各端独有的api,如果有小程序基础,可以直接将“wx.*” 改为 “uni.*”

4. 路由:

uni不支持vue-router,uni-app页面路由为框架统一管理,开发者需要在pages.json里配置每个路由页面的路径和页面样式。类似的小程序在app.json中配置页面路由相同。

5.生命周期

小程序的生命周期分为两种:





6.编译的语法不一


在vue中可以使用npm run dev  或者npm   run serve
但是在nuiapp中  需要使用  npm run  dev:mp-weixin  或者  npm run serve:mp-weixin

7.其他的一些特殊情况
默认情况下,小程序不支持npm,在使用npm之前最好进行npm构建  在工具选项栏下的npm构建,点击即可
一般情况下不在uniapp中使用v-show,因为在uniapp中会出现初始值不生效的问题,故一般使用v-if

手机页面与小程序一样,overflow:scroll 是有问题的,它容易与页面滚动起冲突,在小盒子设置滚动的时候,会造成页面的滚动,小程序中提供了专门实现区域滚动的组件
scroll-view  该方法的使用需要直接在需要进行滚动的标签内部设置属性   scroll-y(竖直滚动)scroll-x(横向滚动)  或者使用swiper组件进行设置滚动的距离为滚动多少,就移动多少,或者使用iscroll 组件

在小程序中使用键盘监听的时候,有专门的监听事件,我们平时的监听事件的方法在小程序中并不使用,例如:在pc端可以使用.enter修饰符进行enter键的修饰,但是在小程序中我们需要对input注册@confirm事件,进行虚拟键盘的确认(或者完成,或者搜索的按键)进行监听

在uniapp中使用navigateTo({path:''})进行路由跳转,此方法会累加路由,如果返回会返回之前跳转的页面,redirectTo会在跳转过后,删掉之前一个跳转到的路由,reLanch会在跳转页面后删除掉之前所有的路由历史,switchTab会切换当前的下方得tab导航。

通过onLoad函数可以获取地址中携带的参数,vue可以通过this.$router.query获取








1060535-20181124095517830-1894523015.png (32.04 KB, 下载次数: 35)

1060535-20181124095517830-1894523015.png

2.png (70.9 KB, 下载次数: 27)

2.png

0 个回复

您需要登录后才可以回帖 登录 | 加入黑马