微信小程序开发学习记录01

微信小程序结构

根目录

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>