前言
最近開發(fā)一個投票小程序，適合入門練手。
大概實現(xiàn)幾點功能：
- 列表展示內(nèi)容，可展開詳情
- 獲取用戶信息，每個微信用戶可限制投票次數(shù)
- 管理頁面（管理員身份可見），錄入管理信息
- 簡單的后臺接口，投票信息增刪查改
創(chuàng)建項目
打開官方的微信開發(fā)者工具，選擇小程序，發(fā)現(xiàn)可以使用TypeScript和css預(yù)編譯，選擇TypeScript Less.
創(chuàng)建小程序,選擇typecript less
進入開發(fā)頁面，可以發(fā)現(xiàn)文件后綴為.ts了。
開發(fā)頁面
安裝一些插件，有些類似vs code，使用方便。自帶的代碼格式化功能一般，默認(rèn)切換到prettier.
安裝插件
Collapse 折疊面板
找了一下，發(fā)現(xiàn)微信沒有提供這個組件，先簡單手寫一個。
折疊面板
<!--index.wxml--><view class="home"> <view class="com-collapse"> <view class="com-collapse-item" wx:for="{{5}}" wx:key="i" bindtap="onExpand"> <text class="com-collapse-item-title"> 標(biāo)題{{item 1}}</text> <view class="com-collapse-item-details" style="display: {{display}}">456156</view> </view> </view></view
獲取用戶信息-坑
使用getUserProfile獲取用戶信息遇到坑了，函數(shù)在onLoad以及其他函數(shù)調(diào)用都不彈窗獲取用戶信息，只有按鈕直接綁定事件才行。
解決：使用wx.showModal手動彈窗
showModal
loginModal() { const that = this; wx.showModal({ title: "需要授權(quán)獲取用戶信息", success: function (res) { if (res.confirm) { that.getUserProfile(); //這里是點擊了確定以后 console.log("用戶點擊確定"); } else { //這里是點擊了取消以后 console.log("用戶點擊取消"); } }, }); },
成功獲取到用戶信息，詳情頁面基本完成，下一步進行管理頁面和接口的開發(fā)。
版權(quán)聲明：本文內(nèi)容由互聯(lián)網(wǎng)用戶自發(fā)貢獻，該文觀點僅代表作者本人。本站僅提供信息存儲空間服務(wù)，不擁有所有權(quán)，不承擔(dān)相關(guān)法律責(zé)任。如發(fā)現(xiàn)本站有涉嫌抄襲侵權(quán)/違法違規(guī)的內(nèi)容， 請發(fā)送郵件至 舉報，一經(jīng)查實，本站將立刻刪除。