微信小程序结构
根目录
app.js:小程序逻辑文件(必须)
app.json:小程序配置文件(必须)
app.wxss:全局公共样式文件(非必须)
pages
组成小程序的多个页面,每个页面都有:
.js:页面逻辑文件(必须)
.wxml:页面逻辑文件(必须)
.wxss:页面样式表(非必须)
.json文件:页面配置(非必须)
utils文件夹
用来存一些公共的js文件
项目开始
参考《微信小程序开发入门与实践》 "Orange Can"项目
app.json–配置添加页面
利用pages,代码如下:
{pages":["pages/welcome/welcome","pages/posts/posts","pages/movies/more-movie/more-movie","pages/movies/movies","pages/movies/movie-detail/movie-detail","pages/posts/post-detail/post-detail","pages/posts/post-item/post-item","pages/posts/post-comment/post-comment"]
}
页面.js文件不能空白
可以暂时添加代码:
Page({})
页面.json文件也不能空白
可以暂时添加代码(空白属性):
{
}
页面.wxml文件-构建页面的元素和样式
介绍三种组件:view text和image
view组件:通常作为容器使用
text组件:显示文本
image组件:显示图像,src:图像路径
代码如下:
<view><image src="/images/.../Orange.png"></image><text>Hello,橘子罐头</text><view><text>开启小程序之旅</text></view>
</view>