繼續-》》

在app.json檔案的pages下寫一個想要的名字 ，然後Ctrl+S儲存自動會生成四個檔案：.js .json .wxml .wxss

.wxml :類似html

看一下常用標籤:

<view> 類似於div
<button> 按鈕
<form>表單
<image>圖片
<text> 文字
<icon>圖示
<checkbox> 複選框
<radio>單選框
<input>輸入框
<progress>進度條

wxss樣式

選擇器：類似

#id 　　 id="balabala"

.class 　　class="balabala"

element　　 view

::after 　　　 view::after

::before 　　 view:before

根據螢幕大小改變的 rpx

引用外來樣式：

@import "../index/index.wxss";

可以把全域性樣式寫到：app.wxss

當然頁面本身的樣式優先順序要高於全域性樣式。

.js

開啟js檔案。可以看到生命週期函式和事件處理函式。註解已幫我們寫好。

生命週期：

onLoad：監聽頁面載入，一個頁面只會呼叫一次。

onReady：監聽頁面初次渲染完成。一個頁面只會呼叫一次。

onShow：監聽頁面顯示。例如，從後臺切入前臺時觸發。

onHide：監聽頁面隱藏。例如，從前臺切入後臺時觸發。

onUnload：監聽頁面解除安裝。例如，使用路由API中的wx.redirectTo()或wx.navigateBack()跳轉其他頁面時觸發。

事件處理函式：

.json配置檔案

app.json是應用級配置檔案；我們自己建立的是頁面級配置檔案。

在頁面及配置檔案中我們可以改變：導航欄樣式、是否允許滾動條等等。

bind繫結：

　　tap：點選事件；

　　longtap：長按事件；

　　touchstart：觸控開始；

　　touchend：觸控結束；

　　touchcancel：取消觸控；

單擊“⋯”會在底部彈出一個選單，在選單中有一項“轉發”，單擊轉發就會觸發onShareAppMessage 事件。單擊“⊙”可以在前臺、後臺之間切換，通過此按鈕可以測試onShow和onHide事件

debug：

"debug": true

彈窗：

1.

程式碼：

wx.showToast({
        title: '暗號錯誤！',
        icon: 'none',
        duration: 1500
})

2.

程式碼：

wx.showModal({
        title: '提示',
        content: '是否跳轉？',
        success: function (res) {
          if (res.confirm) {//這裡是點選了確定以後
            console.log('使用者點選確定')
          } else {//這裡是點選了取消以後
            console.log('使用者點選取消')
          }
        }
})

跳轉：

1.後臺 引數：url ,success ,fail ,complete

wx.navigateTo(OBJECT)

2.跳轉到應用的某個頁面引數：url ,success ,fail ,complete

wx.redirectTo(OBJECT) 

3.返回上一頁引數：data

wx.navigateBack(OBJECT) 

等有時間 待完成

@