文章介绍了QQ小程序的开发环境搭建，那么本篇文章将介绍QQ小程序项目的目录结构的含义以及开发框架的简单介绍。先看下图。项目目录这是新建QQ小程序后工具自动生成的项目结构，打开你的项目保存目录，就会看到这些。我们需要在QQ小程序开发工具中看到这样的目录结构，需要在调试区域的Filesystem标签下将项目文件夹添加到workspace中，这样在Filesystem中看到的就是真实的项目结构了。如下图所示。注意是在Filesystem中添加目录接下来介绍目录含义。pages文件夹：包含了所有的小程序页面文件。自动生成的框架默认添加了两个页面，一个是首页，一个是日志输出页。可以看到，每一个页面包含了四个文件，这四个文件，名称必须相同，扩展名不同，.json文件是页面配置文件，.qml文件是页面html文件，.qss是页面样式文件，.js文件是注册页面用的。小程序中所有的页面都必须包含这几个文件。utils文件夹：包含了公用的一些工具，包括函数、静态变量等。app.json：公共的页面配置项，比如可以配置导航条的样式等公共配置。app.qss：公共的页面样式配置文件。其实就是前端开发中的css文件app.js：用来注册一个小程序。注册小程序用的，必须要有这个文件。project.config.json：项目的配置文件，配置项目的各种属性等。下面说一下小程序整体开发步骤。建立一个小程序，必须在项目根目录有app.json进行页面配置、app.js用于注册小程序。在app.js中，系统给出一个app()函数用于注册小程序。下图是自动生成的注册函数，这个函数只要写出app({})就能注册小程序，因为它接收一个object类型的参数。App函数用于注册小程序在app.json中，通过pages标签来配置页面，每一个页面都要在这里配置，不然编译会报错。页面是在pages文件夹中添加的。pages标签配置每一个页面在pages文件夹中添加一个页面，为了让目录结构更清晰，先创建文件夹，再创建一个页面所需的四个文件，里面的.js文件和.qml文件是必须的，一个用于注册页面，一个用于描述页面的结构。至于样式文件、配置文件都可以不用写东西。在页面的.js文件中用Page()函数注册一个页面。和注册小程序类似，Page函数也是需要一个object参数。在.qml中主要通过view标签来搭建页面，view就相当于div标签了。标签结构页面写好后在app.json进行配置才能够显示。配置页面
转载请注明：http://www.aierlanlan.com/grrz/8655.html
