精易论坛

标题: uni-app和HTML的区别 [打印本页]

作者: 陆先森    时间: 2021-10-29 20:21
标题: uni-app和HTML的区别

uni-app 是一个使用 Vue.js 开发所有前端应用的框架,开发者编写一套代码,可发布到iOS、Android、H5、以及各种小程序(VX/zfb/百d/头条/QQ/钉钉)等多个平台。


对于web前端开发者来说不用花费大量的学习成本上手,只需要了解常用的一些uni-app与HTML的区别,比如:



  1. 传统概念的转换:组件/标签,以前是html标签,现在是小程序标签

  2. div改成view

  3. span/font 改成text

  4. a标签改成navigator

  5. img改成image

  6. select改成picker

  7. ul/li 没有了,用view 代替

  8. audio不在推荐使用,改成api方式

  9. input 还在,但type属性改成了confirmtype

  10. iframe 改成 web-view


像form、button、checkbox、radio、label、textarea、canvas、video 这些还在,其实老的HTML标签也可以在uni-app里使用,uni-app编译器会在编译时把老标签转为新标签。但不推荐这种用法,调试H5端时容易混乱,基于元素的选择器也会出问题。


除了改动外还新增了一些移动端常用的组件,比如:



cover-view 可覆盖原生组件的视图容器


(cover-view需要注意:uni-app的非h5端的video、map、canvas、textarea是原生组件,

层级高于其他组件。如需覆盖原生组件,比如在map上加个遮罩,则需要使用cover-view组件)


以前dom操作,改成vue的MVVM模式:



css区别:








欢迎光临 精易论坛 (https://125.confly.eu.org/) Powered by Discuz! X3.4