小程式 自定義alert彈窗 帶動畫

2022-07-24 20:06:17 字數 824 閱讀 3421

小程式官方提供的alert彈窗 沒法自定義,如果需要在上面修改,新增乙個input 或者 textarea就沒辦法做到,因此出於此目的,封裝了一套自己的彈窗控制項,並且通過定義多個slot插槽來提供自定義

能實現功能

點選彈出有spring動畫

title和content都可以自定義

提供插槽自定義額外內容

事件按鈕支援button功能,可以有獲取使用者資訊功能 (open-type)

按鈕可以支援style修改

上圖

"style": "v2",
使用**

普通彈窗

登入彈窗

關閉運單彈窗

輸入手機號彈窗

微信小程式自定義元件 帶動畫的彈窗元件

基本效果如下 具體實現如下 第一步 新建乙個 components 資料夾,用於存放我們以後開發中的所用元件,在 components 元件中新建乙個popup資料夾來存放我們的彈窗元件,在popup下右擊新建 component 並命名為 popup 後,會生成對應的 json wxml wxss...

微信小程式之自定義模態彈窗(帶動畫)例項

1 基本需求。2 案例目錄結構 二 程式實現具體步驟 1.彈框index.wxml 來點我呀 彈窗標題 標題 標題 標題標題 備註確定 2.彈框index.wxss button btn mask drawer screen content drawer box drawer title drawe...

微信小程式自定義彈窗

首先wxml 暫無有關資訊 點選此處 注 hidden屬性用於切換比較頻繁的地方。wxss 設定彈窗樣式 mytoast js page onload function options onready function onshow function onhide function onunload...