uni-app基础知识

news2024/11/18 22:34:10

发展

DCloud于2012年开始研发小程序技术,优化webview的功能和性能,并加入W3C和HTML5中国产业联盟。

2015年,DCloud正式商用了自己的小程序,产品名为“流应用”,它不是B/S模式的轻应用,而是能接近原生功能、性能的App,并且即点即用,第一次使用时可以做到边下载边使用。

为将该技术发扬光大,DCloud将技术标准捐献给工信部旗下的HTML5中国产业联盟 ,并推进各家流量巨头接入该标准,开展小程序业务。

在2015年9月,DCloud推进微信团队开展小程序业务,演示了流应用的秒开应用、扫码获取应用、分享链接获取应用等众多场景案例,以及分享了webview体验优化的经验。

微信团队经过分析,于2016年初决定上线小程序业务,但其没有接入联盟标准,而是订制了自己的标准。

DCloud持续在业内普及小程序理念,推进各大流量巨头,包括手机厂商,陆续上线类似小程序/快应用等业务。部分公司接入了联盟标准,但更多公司因利益纷争严重,标准难以统一。
例如:
微信小程序
支付宝小程序

造成混乱的局面非DCloud所愿。于是开发了一个免费开源的框架 -----uni-app。

什么是uni-app

uni-app 是一个使用 Vue.js 开发所有前端应用的框架,开发者编写一套代码,可发布到iOS、Android、Web(响应式)、以及各种小程序(微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝)、快应用等多个平台。

uni-app 是免费并且属于Apache2.0开源协议的产品。DCloud官方承诺无论HBuilderX、uni-app,面向全球程序员永久免费。大家可以放心使用。

uni-app简单来说是 vue的语法 + 小程序的api。

它遵循Vue.js语法规范,组件和API遵循微信小程序命名

使用

原生小程序和uni-app

触摸事件:
①微信小程序:bindtap
②uni-app:@click

函数传参方式:
①微信小程序:<view bindtap="click" data-id="id"></view>
②uni-app:<view @click="click(id)"></view>

函数接收参数:
①微信小程序:function(e){this.setData(currentId:e.currentTarget.dataset.id)}
②uni-app:function(id){this.currentId = id}

for 循环:
①微信小程序:<view wx:for="{{currentList}}" wx:for-index="s_index" wx:for-item="s_item"></view>
②uni-app:<view v-for="(s_item,s_index) in currentList"></view>

if 判断:
①微信小程序:<view wx:if="{{isShow}}"></view>
②uni-app:<view v-if="isShow"></view>
  • 由此可见,使用原生的小程序我们需要学习一套新的小程序语法,而使用uni-app则可以使用vue的语法,不用根据不同的小程序平台写不同的代码
小程序和h5 区别

在uni-app的各个端中,除了h5端,其他端的js都运行在一个独立的v8引擎下,不是在浏览器中,因此浏览器专用的window、document、navigator、location对象,包括cookie等存储,app和小程序都不支持。

这意味着依赖document的很多HTML的库,比如jquery无法使用。

当然app和小程序支持web-view组件,里面可以加载标准HTML,这种页面仍然支持浏览器专用对象window、document、navigator、location。

小程序和uni-app项目目录结构区别

微信小程序目录结构
uni-app目录结构

组件

uni-app组件

UI库

uView是uni-app生态专用的UI框架

uView来源于社区,也回归到社区,正是有一群热爱uni-app生态的同学推着它前行,而我们也一如既往的承诺,uView永久开源,永远免费。

关于uView的取名来由,首字母u来自于uni-app首字母,uni-app是基于Vue.js,Vue和View(延伸为UI、视图之意)同音,同时view组件是uni-app中 最基础,最重要的组件,故取名uView,表达源于uni-app和Vue之意,同时在此也对它们表示感谢。

uView

uni-app和原生小程序的api

uni-app 基于 ECMAScript 扩展了 uni 对象,并且 API 命名与小程序保持兼容。
uni-app和微信小程序的api基本相同,只是微信小程序使用wx.api(),使用uni-app时使用uni.api()
各平台的 API 新增,不需要 uni-app 升级,开发者就可以直接使用。

uni-API

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/736780.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Debezium系列之:基于debezium将mysql数据库数据更改流式传输到 Elasticsearch和PostgreSQL数据库

Debezium系列之&#xff1a;基于debezium将mysql数据库数据更改流式传输到 Elasticsearch和PostgreSQL数据库 一、背景二、技术路线三、配置四、从mysql同步数据到Elasticsearch和PostgreSQL数据库五、总结 一、背景 基于 Debezium 的端到端数据流用例&#xff0c;将数据流式传…

I/O 多路复用小结

Socket 模型 Socket 编程是一种使用 Socket 模型进行网络通信的编程技术。它是一种基于网络套接字的编程模型&#xff0c;用于实现不同计算机之间的数据传输。 事实上&#xff0c;在进行网络通信前&#xff0c;通信双方都要创建一个 Socket&#xff0c;双方的数据读写都要依赖于…

【Python】执行SQL报错

可以再数据库查询界面执行的SQL&#xff0c;一直报错 unsupported format character Y (0x59) at index 61 SQL如下&#xff1a; datapd.read_sql_query(sql"""selectdate_format(create_time,%Y-%m) as mon,count(distinct order_id) as ord_cntfrom prod.o…

HTTP与HTTPS

HTTP与HTTPS介绍 超文本传输协议HTTP协议被用于在Web浏览器和网站服务器之间传递信息&#xff0c;HTTP协议以明文方式发送内容&#xff0c;不提供任何方式的数据加密&#xff0c;如果攻击者截取了Web浏览器和网站服务器之间的传输报文&#xff0c;就可以直接读懂其中的信息&…

qt源码--事件系统

qt的事件传播主要依赖于QCoreApplication、QAbstractEventDispatcher&#xff08;会根据不同的平台生成各自的处理对象&#xff09;、QEvent&#xff08;各种事件类型&#xff09;等。 首先看下QCoreApplication的实现&#xff1a; 2、了解QCoreApplication的构造函数 其构造函…

在最新ICP备案域名的基础上,结合其他网络营销手段,打造强大的品牌推广效果

API接口是一种软件系统之间进行交互的方式&#xff0c;通过API接口&#xff0c;可以在不同的系统之间传递数据、命令等信息。在网络营销中&#xff0c;API接口可以帮助我们更加高效地进行品牌推广。本文将以在最新ICP备案域名的基础上&#xff0c;结合其他网络营销手段&#xf…

JVM回收算法(标记-清除算法, 复制算法, 标记-整理算法)

1.标记-清除算法 最基础的算法&#xff0c;分为两个阶段&#xff0c;“标记”和“清除” 原理&#xff1a; - 标记阶段&#xff1a;collector从mutator根对象开始进行遍历&#xff0c;对从mutator根对象可以访问到的对象都打上一个标识&#xff0c;一般是在对象的header中&am…

vue-router 4.0 动态路由会跳转到 404 页面的问题

引子 开发过前端单页面应用的小伙伴们&#xff0c;应该对前端路由都不陌生吧。 无论是用 vue 或者 react&#xff0c;都有官方提供的 router 方案。 但是有些场景下&#xff0c;处于安全性和友好性考虑&#xff0c;我们需要用到动态路由。 如果你不知道什么叫动态路由&…

翻遍整个牛客网,整理出了全网最全的Java面试八股文大合集,整整4000多页

大家从 Boss 直聘上或者其他招聘网站上都可以看到 Java 岗位众多&#xff0c;Java 岗位的招聘薪酬天差地别&#xff0c;人才要求也是五花八门。而很多 Java 工程师求职过程中&#xff0c;也是冷暖自知。很多时候技术有&#xff0c;但是面试的时候就是过不了&#xff01; 为了帮…

4.7 x64dbg 应用层的钩子扫描

所谓的应用层钩子&#xff08;Application-level hooks&#xff09;是一种编程技术&#xff0c;它允许应用程序通过在特定事件发生时执行特定代码来自定义或扩展其行为。这些事件可以是用户交互&#xff0c;系统事件&#xff0c;或者其他应用程序内部的事件。应用层钩子是在应用…

【Zabbix 监控 Windows 系统,Java应用,SNMP】

目录 一、Zabbix 监控 Windows 系统1、下载 Windows 客户端 Zabbix agent 22、安装客户端&#xff0c;配置3、在服务端 Web 页面添加主机&#xff0c;关联模板 二、Zabbix 监控 java 应用1、客户端开启 java jmxremote 远程监控功能1、配置 java jmxremote 远程监控功能2、启动…

【ARM Coresight 系列文章 3.1 - ARM Coresight DP 对 AP 的访问 2】

文章目录 图 1-1 如上图1-1 所示&#xff0c;DAP上可以集成多个MEM-AP&#xff0c;上图是集成了3个MEM-AP&#xff0c;它们可能是AXI-AP, AHB-AP, APB-AP。 那么AP的类型是如何区分的呢&#xff1f; 不同的组件会使用不同MEM-AP接口&#xff0c;如Cortex-A/Coretex-R 系列的c…

ai绘画工具有哪些?这几款好用的ai绘画工具免费分享给你

上周&#xff0c;我去了一家现代艺术画廊&#xff0c;墙上挂满了令人叹为观止的绘画作品。我被其中一幅细腻而充满情感的油画所深深吸引&#xff0c;想要了解背后的创作过程。这时&#xff0c;一位热情的艺术导师走到我身边。她微笑着说&#xff1a;“这幅作品实际上是由ai绘画…

解决“_mkdir无法识别空格目录“问题

在C编程里&#xff0c;有时候需要创建一个文件夹&#xff0c;通常使用库函数_mkdir(const char* dirname)来新建一个文件夹&#xff0c;该库函数每次只能创建一个文件夹&#xff0c;不能级联创建。若要级联创建文件&#xff0c;则请用递归方式或者for循环方式调用_mkdir()。 #…

7月6日华为云盘古气象大模型登上《Nature》杂志:相比传统数值预报快10000倍

7月6日&#xff0c;国际顶级学术期刊《自然》&#xff08;Nature&#xff09;杂志正刊发表了华为云盘古大模型研发团队的最新研究成果——《三维神经网络用于精准中期全球天气预报》&#xff08;《Accurate medium-range global weather forecasting with 3D neural networks》…

CrossKD 原理与代码解析

paper&#xff1a;CrossKD: Cross-Head Knowledge Distillation for Dense Object Detection official implementation&#xff1a; https://github.com/jbwang1997/CrossKD 前言 蒸馏可以分为预测蒸馏prediction mimicking和特征蒸馏feature imitation两种&#xff0c;201…

【LeetCode】HOT 100(26)

题单介绍&#xff1a; 精选 100 道力扣&#xff08;LeetCode&#xff09;上最热门的题目&#xff0c;适合初识算法与数据结构的新手和想要在短时间内高效提升的人&#xff0c;熟练掌握这 100 道题&#xff0c;你就已经具备了在代码世界通行的基本能力。 目录 题单介绍&#…

什么是 AOP?对于 Spring IoC 和 AOP 的理解?Spring AOP 和 AspectJ AOP 有什么区别?

什么是 AOP&#xff1f; AOP(Aspect-Oriented Programming)&#xff0c;即 面向切面编程&#xff0c; 它与OOP( ObjectOriented Programming, 面向对象编程) 相辅相成&#xff0c;提供了与OOP 不同的抽象软件结构的视角 在 OOP 中, 我们以类(class)作为我们的基本单元 而 A…

Zynq 多个UDP客户端组网启动问题(Auto negotiation error)PS:附UDP客户端初始化代码

最近正在进行一个Zynq项目&#xff0c;根据设计需求&#xff0c;需要将上位机作为UDP服务器&#xff0c;而FPGA则充当UDP客户端。同时&#xff0c;服务器需要能够接收和控制多个UDP客户端。 开发过程中&#xff0c;我是基于lwip UDP Perf Client 官方模版开发的。我遇到了以下几…

重磅!高通大客户「跳单」,智能座舱SoC赛道进入「混战期」

哪家车企是高通座舱芯片的最大客户&#xff1f;答案不是蔚来、理想、小鹏等智能化布局领先的新势力&#xff0c;而是比亚迪。 高工智能汽车研究院监测数据显示&#xff0c;2022年中国市场&#xff08;不含进出口&#xff09;乘用车智能座舱前装标配高通芯片交付367.45万辆&…