其實也算是挺簡單的乙個功能:
首先我們可以將頁面畫出來
wxml
vip}}}wxss}
刪除
/* pages/actiondetail/index.wxss */js裡面加一點假資料.inforlist
.inforlist .list
.list .infor_img
.list .content
.content .con_top
.con_top .con_right
.con_top .vip
.con_top .infor_name
.con_top .infor_time
.content .con_bottom
.con_bottom .infor_near
.con_bottom .infor_num
.list .remove
data: ,,,這樣我們基本的頁面就出來了 其次我們該考慮怎麼樣實現左滑出現刪除呢],startx: 0
},
這裡我的做法很簡單,那就是控制它的left值(css裡面我給他定位了),刪除在最右邊 我們可以修改left值檢視
n那麼接下來就是考慮用什麼方法控制他的left值,這裡就用到了官網裡面給的三個方法
那麼我們就試著用用他
// pages/actiondetail/index.jsdeltap (e)page(,,,
],startx: 0
},/**
* 生命週期函式--監聽頁面載入
*/onload: function (options) ,
drawstart: function (e)
this.setdata()
},drawmove: function (e) else
this.setdata()
} else )
}},
drawend: function (e) )
} else )}},
})this.setdata()
},
/**這樣我們就實現了向左滑動出現刪除功能* 生命週期函式--監聽頁面初次渲染完成
*/onready: function () ,
/*** 生命週期函式--監聽頁面顯示
*/onshow: function () ,
/*** 生命週期函式--監聽頁面隱藏
*/onhide: function () ,
/*** 生命週期函式--監聽頁面解除安裝
*/onunload: function () ,
/*** 頁面相關事件處理函式--監聽使用者下拉動作
*/onpulldownrefresh: function () ,
/*** 頁面上拉觸底事件的處理函式
*/onreachbottom: function () ,
/*** 使用者點選右上角分享
*/}})
微信小程式todolist新增和刪除功能
新增wxml頁面 繫結bindinput oninput 事件獲取value 的值,然後給button按鈕繫結點選事件bindtap onclick data 獲取輸入框的值 oninput function e 點選新增 onclick function 刪除 wxml頁面,渲染來自新增的內容,給...
微信小程式 開發列表
一.知識點 tip wx for array 可以等於引數名,在js中呼叫 page 獲取值 也可以直接把wx for 把值放在上面 1.在元件上使用wx for控制屬性繫結乙個陣列,即可使用陣列中各項的資料重複渲染該元件。預設陣列的當前項的下標變數名預設為index,陣列當前項的變數名預設為ite...
微信小程式功能介紹
援引官方對產品的定義 框架為開發者提供了一系列基礎元件,開發者可以通過組合這些基礎元件進行快速開發。基礎元件分為以下八大類 檢視容器 基礎內容 表單操作反饋 導航多 地圖畫布 將本地資源上傳到開發者伺服器 一種在單個tcp連線上進行全雙工通訊的協議,能夠輕鬆構建低延遲的客戶端。從本地相簿選擇或使用相...