miniprogram-framework

Miniprogram-framework is a personal framework dedicated to a concise and highly available development experience.

instructions

Read the documentation and sample project carefully before using

These applets are all written based on Vant/ EAPPp and are designed to provide an overview of UI reuse.

Component list

  • City – picker component
  • City – the selector component
  • Layout components
  • The Pagination component is referenced in WXP-UI

How to use

This small program has been small program HTTP,log,toast,storage encapsulation, specific can see utils/* directory source, has been mounted to the global WX directly call

// Check update checkUpdateVersion() // Set request address setRequestUrl(this) // Encapsulate toast wx.toast = toast // Encapsulate Storge wx.storge = storge // Wx. log = new log (this)Copy the code

checkUpdateVersion setRequestUrl

Utils /system.jsCopy the code

wx.toast

wx.toast
wx.toast.loading
wx.toast.success
wx.toast.error
Copy the code

Parameters: the options (Number | String) | | Object parameters for the Object reference WeChat applet toast, please

wx.storge

wx.storge.set
wx.storge.get
wx.storge.remove
wx.storge.clear
Copy the code

wx.http

wx.http.request.get wx.http.request.post wx.http.request.put wx.http.request.delete ... Wx.http. request({URL: '/ API /xx', data:{},}) /** * @URL Request address Mandatory * @method Request mode Default POST * @header Request header Optional * @data Request parameters */Copy the code

Component configuration

City – picker component

city-picker Attributes

parameter instructions type An optional value The default value
cityPickerColumnsNum List the number of columns Number 1, 2, 3 3
` ` `
/ / call
this.selectComponent(‘#city-picker’).showCityPicker()
this.selectComponent(‘#city-picker’).data.values
Or page bound event methods
` ` `

city-selector

city-selector Attributes

parameter instructions type An optional value The default value
cityList The data source Array — []
hotCityList Hot urban data source Array — []
showSearch Show the search Boolean — false
showLocation Display orientation Boolean — false
mapKey Map location key string —

city-selector Events

The name of the event instructions The callback parameter
getCity Get City Events The name of the currently selected city

Layout components

The UI layout

parameter instructions type An optional value The default value
padding-top Boolean true/false false —
use-footer-slot Bottom button area slot . .

layout Slots

name instructions
— Page body
footer Bottom of the page 44px

Pagination components

pagination Attributes

parameter instructions type An optional value The default value
requesting Whether the list data is being loaded Boolean — false
end The list data is loaded successfully Boolean — false
emptyShow Control the empty state display Boolean — false
use-empty-slot Slots for empty lists Boolean — false
listCount Current list length Number — 0
emptyUrl Display image of empty list String * /assets/image/empty/empty.png
emptyText Text prompt for an empty list String * No data found
refreshSize Drop down the height of the refresh Number — 90
topSize At the top of the height Number — 0
bottomSize At the bottom of the highly Number — 0
color color String — “”
enableBackToTop Double click on the top status bar to return to the top Boolean — false

pagination Events

The name of the event instructions The callback parameter
refresh The drop-down refresh —
more Pull on loading —

pagination Slots

name instructions
— List component body
empty An empty list

contribution

If you have any good suggestions, please mention issues

License

MIT