国产粉嫩无码不卡在线观看,酒店大战丝袜高跟鞋人妻,特级精品毛片免费观看,欧美亚洲日本国产综合在线

微信小程序開發(fā)-投票小程序一(微信小程序做投票)

前言

最近開發(fā)一個投票小程序,適合入門練手。

大概實現(xiàn)幾點功能:

  1. 列表展示內容,可展開詳情
  2. 獲取用戶信息,每個微信用戶可限制投票次數(shù)
  3. 管理頁面(管理員身份可見),錄入管理信息
  4. 簡單的后臺接口,投票信息增刪查改

創(chuàng)建項目

打開官方的微信開發(fā)者工具,選擇小程序,發(fā)現(xiàn)可以使用TypeScript和css預編譯,選擇TypeScript Less.

微信小程序開發(fā)-投票小程序一(微信小程序做投票)

創(chuàng)建小程序,選擇typecript less

進入開發(fā)頁面,可以發(fā)現(xiàn)文件后綴為.ts了。

微信小程序開發(fā)-投票小程序一(微信小程序做投票)

開發(fā)頁面

安裝一些插件,有些類似vs code,使用方便。自帶的代碼格式化功能一般,默認切換到prettier.

微信小程序開發(fā)-投票小程序一(微信小程序做投票)

安裝插件

Collapse 折疊面板

找了一下,發(fā)現(xiàn)微信沒有提供這個組件,先簡單手寫一個。

微信小程序開發(fā)-投票小程序一(微信小程序做投票)

折疊面板

<!--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"> 標題{{item 1}}</text> <view class="com-collapse-item-details" style="display: {{display}}">456156</view> </view> </view></view

獲取用戶信息-坑

使用getUserProfile獲取用戶信息遇到坑了,函數(shù)在onLoad以及其他函數(shù)調用都不彈窗獲取用戶信息,只有按鈕直接綁定事件才行。

解決:使用wx.showModal手動彈窗

微信小程序開發(fā)-投票小程序一(微信小程序做投票)

showModal

loginModal() { const that = this; wx.showModal({ title: "需要授權獲取用戶信息", success: function (res) { if (res.confirm) { that.getUserProfile(); //這里是點擊了確定以后 console.log("用戶點擊確定"); } else { //這里是點擊了取消以后 console.log("用戶點擊取消"); } }, }); },

成功獲取到用戶信息,詳情頁面基本完成,下一步進行管理頁面和接口的開發(fā)。

版權聲明:本文內容由互聯(lián)網用戶自發(fā)貢獻,該文觀點僅代表作者本人。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。如發(fā)現(xiàn)本站有涉嫌抄襲侵權/違法違規(guī)的內容, 請發(fā)送郵件至 舉報,一經查實,本站將立刻刪除。