跳转至

面向初学者的物联网全栈开发指南 - 6 - uni-app起步

最后,我们要构建一个uni-app,并调用云函数建立起属于自己的全平台客户端,这里只对uni-app做一个简单的介绍,Html,CSS,JS上手比较快,而uni-app在Vue.js的基础上封装了大量的函数,用起来非常方便。

1. 准备工具

2. 项目结构

还是在上一章建立的uni-app中,直接在顶部选择运行,运行到浏览器即可看到当前的项目。uni-app为跨平台项目,运行到浏览器,项目将被编译为H5;运行到小程序模拟器,项目将被编译为对应的小程序;运行到手机或模拟器,项目将被编译为对应的应用程序。

image-20210827183207888

更细致的项目结构请参照文档,在这里只说常用的:

  • pages:在这里右键可以新建页面,页面为.vue格式,一般放置在与页面名相同的文件夹下,index.vue默认为我们的主页(启动页)。
  • pages.json:可以配置启动页、页面样式、导航栏等。pages.json - uni-app官网 (dcloud.io)

  • static:这里存放所有的静态文件,如示例中的图片。

  • manifest.json:项目配置页面。

3. 页面结构

我们打开index.vue,这是这个项目的启动页,他由HTML(\