一、介绍

什么是uniapp

1、uniapp是由dcloud 公司开发的多端融合框架。uniapp的出现让我们的开发更为方便,一次开发,多端运行。更重要的是学习成本不会很大,因为uniapp主要是Vue语法加上小程序的api,学过vue和小程序,再学uniapp会更加得心应手。
2、端
端分为App端(HTML+ nvue(原生view)native.js(js原生沟通的桥梁) weex内置ios/安卓的模块使用),H5端(h5专用api),各种小程序(微信为主)

二、准备

1、Hbuilderx (开发与编译工具)
2、微信小程序开发工具(微信小程序预览测试)
3、安卓模拟器/真机==>运行app

三、新建项目

项目的组成

运行到多端

H5

直接运行到内置浏览器

运行到微信小程序

首先配置appID

配置微信开发者工具地址


选择运行,运行到小程序模拟器

运行到app

首先配置模拟器端口
常见的模拟器:
夜神模拟器端口号:62001
海马模拟器端口号:26944
逍遥模拟器端口号:21503
MuMu模拟器端口号:7555
天天模拟器端口号:6555


随后点击运行即可

四、语法

uniapp语法基本等同于vue
下面举部分例子

文本渲染
{{表达式}}
v-text=“表达式”
表达式:
简单的js运算
{{2+3}}
js方法调用
{{title.length}}
{{title.split(“”).reverse().join(“”)}}
3元运算符
< view >{{title.length>15?‘长度很长’:‘字少事大’}}< /view>

条件渲染
v-if
v-else-if
v-else
v-show
三元运算符

列表选项
字符串,数字,列表,对象都可以遍历
< view v-for=“(item,index) in list” :key=“index”>{{index+1}} {{item}}</ view >
一定要保证兄弟元素间的key值是唯一

属性绑定
< button v-bind:disabled=“true”>
< button :disabled=“true”>

表单绑定
默认
:value=“单向绑定”
input
v-model=“双向绑定”
@change=“ $ event.detail.value”
事件,事件的值$ event.detail.value

uniapp的生命周期共同拥有vue生命周期和小程序生命周期

uniapp同时具有小程序的全局方法 例子:

onPullDownRefresh
下拉刷新
onReachBottom()
触底更新

uniapp(新手入门)相关推荐

  1. 《挑战30天C++入门极限》新手入门:C/C++中枚举类型(enum)

        新手入门:C/C++中枚举类型(enum) 如果一个变量你需要几种可能存在的值,那么就可以被定义成为枚举类型.之所以叫枚举就是说将变量或者叫对象可能存在的情况也可以说是可能的值一一例举出来. ...

  2. LINUX新手入门-1.装系统

    LINUX新手入门-1.装系统 首先我们用虚拟机模拟 装linux系统,然后下一步下一步,然后完成后,编辑一些设置,把镜像放上面就可以了 选第一项,安装系统,查看镜像是否能运行,直接跳过,选择语言 和 ...

  3. 人工智能新手入门学习路线!附学习资源合集

    有段时间没跟大家分享编程资源福利了!今天为大家整理了人工智能新手入门学习路线,同时附700分钟的学习资源合集,相信这套福利可以帮你顺利入行AI!文末领取全部资料. 一.AI基础好课学习资料整理(约31 ...

  4. 【LaTeX】E喵的LaTeX新手入门教程(4)图表

    这里说的不是用LaTeX画图,而是插入已经画好的图片..想看画图可以把滚动条拉到底.前情回顾[LaTeX]E喵的LaTeX新手入门教程(1)准备篇  [LaTeX]E喵的LaTeX新手入门教程(2)基 ...

  5. 想学python都要下载什么软件-学编程闲余时间建议下载的软件_Python新手入门教程...

    原标题:学编程闲余时间建议下载的软件_Python新手入门教程 Python新手入门教程_在手机上就能学习编程的软件 很多小伙伴会问:我在学编程,想利用坐地铁坐公交吃饭间隙学编程,在手机上能学编程的软 ...

  6. 编程入门python语言是多大孩子学的-不学点编程,将来怎么给孩子辅导作业―Python新手入门教程...

    为了填满AI时代的人才缺口,编程语言教育都从娃娃抓起了!如果你还不懂Python是什么将来怎么给孩子辅导作业呢? Python新手入门教程 近期,浙江省信息技术课程改革方案出台,Python言语现已断 ...

  7. python2好还是python3好-新手入门选择Python2还是Python3

    1. 前言 Python的发展很快,几乎每年都在版本迭代.目前Python有两个主要版本,一个是python2.x,另一个是python3.x. 兔子先生最早接触Python的时候,使用的是pytho ...

  8. python新手入门-python新手入门方法

    随着人工智能 大数据的火热 Python成为了广大科学家和普通大众的学习语言.在学习Python的过程中 有很多人感到迷茫 不知道自己该从什么地方入手,今天我们就来说一些新手该如何学习Python编程 ...

  9. 【LaTeX】E喵的LaTeX新手入门教程(6)中文

    假期玩得有点凶 ._.前情回顾[LaTeX]E喵的LaTeX新手入门教程(1)准备篇  [LaTeX]E喵的LaTeX新手入门教程(2)基础排版  [LaTeX]E喵的LaTeX新手入门教程(3)数学 ...

最新文章

  1. linux异常断电usb驱动丢失,如何修复Linux中损坏的USB驱动器 | MOS86
  2. C++应用程序性能优化(三)——C++语言特性性能分析
  3. Spring Security3.1登陆验证
  4. [Codeforces757G]Can Bash Save the Day?——动态点分治(可持久化点分树)
  5. boost::multiprecision模块debug_adaptor相关的测试程序
  6. 微信小程序-地图组件(map)的使用
  7. Vertex Texture Fetch(VTF) Fragment Texture Fetch ( FTF )
  8. 怎样挑选最健康的酸奶?
  9. 计算机网络之物理层基本概念
  10. CentOS 安装Sqlite3
  11. Lambda表达式妙用
  12. Cobalt Strike 从入门到入狱(三)
  13. (CFD)投影法求解二维不可压缩N-S方程
  14. 机器视觉经典案例-表面划伤检测案例
  15. 阿里云服务器搭建Ghost博客教程
  16. 缓和曲线回头曲线交点法坐标计算实例
  17. 综述国内外三维视觉测量系统的发展现状
  18. Windows取证一
  19. 阿里云盾AliYunDun服务IO超高
  20. 练手项目2笔记之day01

热门文章

  1. 释放技术的想象-解码腾讯云软件架构与应用
  2. canvas绘制矩形
  3. 以酶促反应为例的统计回归问题及代码实现
  4. html代码3D滚球游戏代码,滚球控制系统代码
  5. insertBefore
  6. python输出分数
  7. Unable to handle kernel NULL pointer dereference at virtual address 0000000d[ 435.859000] pgd = c9
  8. FFMPEG 使用显卡加速转码
  9. ApiCloud 文件上传
  10. 简述6种HTML空格