導航:navigator 組件
組件上的屬性:
target:跳到其他小程序( 默認是當前小程序 ),當屬性值為 miniProgram 時,跳到別的小程序(如果要跳到別的小程序,需要填寫 appid 屬性,屬性值: 別的小程序的 id)
open-type:類型 字符串 打開方式
屬性值:navigate(默認) url 屬性后面可以帶參數,跳轉后的頁面,左上角有個返回鍵,可以返回到開始那個頁面
redirect url 屬性后面可以帶參數,關閉了當前頁面,跳轉后的頁面左上角無返回鍵
switchTab url 屬性后面不可以帶參數,只跳轉 tabBar 頁面路徑,否則無效,關閉當前頁
reLaunch 需要跳轉應用內的頁面路徑,路徑后面可以帶參數
url:類型 字符串 要跳轉的頁面路徑 后面通過 open-type 屬性 判斷帶不帶參數 要攜帶的參數 ?name='zhang'&age=20 這種寫法
頁面的參數在 要跳轉的頁面 Page({}) onload() 方法的屬性上面,形參 options 上面
自定義組件:component(組件) 跟pages同目錄 創建 component 目錄
特點:1.每個自定義組件都有四個部分組成 wxml wxss js json
配置 文件為 component 文件
里面的組件設定樣式:只能使用 class 選擇器
json 文件中 設定屬性 component:true
要在開發者工具上面創建組件
框架的方式就是為了組件
這樣的話,自定義組件就配置好了,我們想在頁面中引用這個組件
需要在當前頁面中 json 文件上 用 usingComponents 屬性上 屬性名(代表組件名):屬性值(組件路徑)
在 wxml 文件中使用 組件名即可調用
slot 插槽
為什么要使用 slot 插槽?
因為在我們使用自定義組件時,我們便不能夠在自定義組件里面添加內容,為了解決這個問題,我們使用插槽 slot 組件,slot 組件 必須是 自定義組件內部的子節點。
插槽就是自定義組件,內部的子節點
slot 用法:
自定義組件 json 文件
自定義組件的 wxml 文件:
定義插槽,在自定義組件中,都有唯一的 name 屬性與使用組件中的子節點進行匹配,多個 slot 插槽,須在自定義組件 js 文件中 添加 options 屬性
自定義組件的 js 文件:
自定義組件的 就配置好了,當前頁面的引用:
當前頁面的 json 文件
當前頁面的 wxml 文件
最后的效果圖:
小程序不支持背景圖
小程序中內斂組件 text 組件
小程序可以使用 彈性布局
padding 撐法:如圖: