前兩期講了小程式開發的準備工作以及前期需要如何調試，今天我們就來介紹下開發一個支付寶小程式頁面需要瞭解哪些信息。

一個小程式頁面的整體功能的構成離不開頁面展示（AXML）、頁面樣式（ACSS）以及頁面邏輯（JS）這三方面，下麵本文將從這三方面具體展開。

一、AXML(組件)

AXML 頁面一般用來做頁面的佈局，用支付寶提供的容器和組件在頁面上做編排。

1. 基礎能力與屬性介紹

不同的組件有不同的作用，組件的內容放在開始 <xx> 和結束 <xx/> 標簽之間，分別代表著不同的組件作用。

例如，下方登陸頁面中展示的不同組件：

<!-- axml頁面代碼塊 -->
<view>
  <image mode="scaleToFill" src="http://img.touxiangwu.com/zb_users/upload/2022/11/202211081667896715116887.jpg" />
  <view> 用戶名 </view>
  <input placeholder="" />
  <view> 密碼 </view>
  <input placeholder="" />
  <button size="default" type="primary">登錄</button>
</view>

一般組件都擁有以下的共同屬性：

其中：

• class、style 用來設置標簽的樣式（顏色、大小等）；
• on/catch 對標簽進行事件綁定；
• data-* 可以用來設定標簽的屬性，觸發事件之後，會將該值傳輸給 js 頁面對應的方法中；

• 使用過程中可能會有一些常見問題，例如