微信小程序入门

文件类型

• .wxml：微信模板文件，类似网页开发的html文件。
• .wxss：微信样式表文件，用于定于页面样式。
• .js：脚本文件，代码逻辑写在这。
• .json：静态数据配置文件。

文件

官方文档：官方文档

app.json—小程序全局配置文件

  "pages":[ // 页面路径列表
    "pages/index/index",
    "pages/logs/logs"
  ],
  "window":{
    // 全局的默认窗口表现
    "backgroundTextStyle":"light", // 背景文本样式 可选light dark
    "navigationBarBackgroundColor": "#fff", // 导航背景色，可定义任意颜色
    "navigationBarTitleText": "WeChat", // 导航标题，可定义任意文本
    "navigationBarTextStyle":"black" // 导航文本颜色，可选black white
  }

字段介绍：
pages:用于指定小程序由哪些页面组成，每一项都对应一个页面的 路径（含文件名） 信息。新增/减少页面，都需要对 pages 数组进行修改.
windows：用于设置所有页面的状态栏、导航条、标题、窗口背景色等。这是一个全局的配置，修改之后所有页面都会生效，在单个页面json配置中定义独特的风格可以覆盖全局配置。
其他字段：（可以在官网查看各个参数的详细的使用方式）

app.js

• data:{} ：页面的初始数据
• onLoad: function (){}： 监听页面加载，一个页面只会调用一次。
• onShow：监听页面显示，每次打开页面都会调用一次。
• onReady：监听页面初次渲染完成，一个页面只会调用一次，代表页面已经准备妥当，可以和视图层进行交互。
• onHide：监听页面隐藏，当navigateTo或底部tab切换时调用。
• onUnload：监听页面卸载，当redirectTo或navigateBack的时候调用。
• onPullDownRefresh：用户下拉动作的处理函数
• onReachBottom：页面上拉触底事件的处理函数
• onShareAppMessage：用户点击右上角分享时的处理函数

边开发边自学

设置组件view的样式

在index.wxml文件中设置class：

<view>
  <view class = "top-title">
  </view>
</view>

然后在对应的index.js文件中设置样式：

.top-title {
   
	...
}

在样式中设置居中

.top-title {
   
	height: