[TOC]
# 小程序
## 小程序簡介
### 文檔與結(jié)構(gòu)
小程序結(jié)構(gòu)圖

**app.json文件小程序設(shè)置全局配置 ,包括頁面路徑、窗口、選項卡,以及網(wǎng)絡(luò)超時等
app.js文件中App()來注冊一個小程序 提供了生命周期方法
app.wxss小程序應用的樣式文件**
小程序文件結(jié)構(gòu)圖
### 知識儲備
* 首先得有一定的網(wǎng)站開發(fā)基礎(chǔ)(html css js)
* 因為不能像做網(wǎng)站那樣用js中的window,document方法,所以要多看官網(wǎng)給的api文檔
* 全新的一個模式,好多東西微信自己都還沒定下來,所以就是要多看多練。
* 由于大小限制,所以不適合做大型開發(fā)。
## 小程序常用的API和邏輯綁定方法
**wx.request https網(wǎng)絡(luò)請求**
~~~
wx.request({
url: 'test.php', //僅為示例,并非真實的接口地址
method:"GET",
data: {
x: '' ,
y: ''
},
header: {
'content-type': 'application/json'
},
success: function(res) {
console.log(res.data)
}
})
~~~
**本地緩存**<br>
**通過key的形式添加緩存setStorage (異步接口)**
~~~
wx.setStorage({
key:"key"
data:"value"
})
~~~
**通過key的形式獲取緩存getStorage (異步接口)**
~~~
wx.getStorage({
key: 'key',
success: function(res) {
console.log(res.data)
}
})
~~~
**從本地緩存中異步移除指定 key**
~~~
wx.removeStorage({
key: 'key',
success: function(res) {
console.log(res.data)
}
})
~~~
**清理本地數(shù)據(jù)緩存**
~~~
wx.clearStorage()
顯示、隱藏消息提示框
wx.showToast({
title: '加載中',
icon: 'loading',
duration: 10000
})
setTimeout(function(){
wx.hideToast()
},2000)
~~~
**動態(tài)設(shè)置當前頁面的標題**
~~~
wx.setNavigationBarTitle({
title: '當前頁面'
})
~~~
**導航**
**保留當前頁面,跳轉(zhuǎn)到應用內(nèi)的某個頁面**
~~~
wx.navigateTo({
url: 'test?id=1'
})
~~~
**關(guān)閉當前頁面,跳轉(zhuǎn)到應用內(nèi)的某個頁面**
~~~
wx.redirectTo({
url: 'test?id=1'
})
~~~
**獲取用戶信息,需要先調(diào)用 wx.login 接口**
~~~
wx.getUserInfo({
success: function(res) {
var userInfo = res.userInfo
var nickName = userInfo.nickName
var avatarUrl = userInfo.avatarUrl
var gender = userInfo.gender //性別 0:未知、1:男、2:女
var province = userInfo.province
var city = userInfo.city
var country = userInfo.country
}
}
)
~~~
**設(shè)備
獲取網(wǎng)絡(luò)類型**
~~~
wx.getNetworkType({
success: function(res) {
var networkType = res.networkType // 返回網(wǎng)絡(luò)類型2g,3g,4g,wifi
}
})
~~~
**獲取系統(tǒng)信息(異步接口)**
~~~
wx.getSystemInfo({
success: function(res) {
console.log(res.model)
console.log(res.pixelRatio)
console.log(res.windowWidth)
console.log(res.windowHeight)
console.log(res.language)
console.log(res.version)
}
})
~~~
**撥打電話**
~~~
wx.makePhoneCall({
phoneNumber: '1340000' //僅為示例,并非真實的電話號碼
})
~~~
**獲取當前的地理位置、速度**
~~~
wx.getLocation({
type: 'wgs84',
success: function(res) {
var latitude = res.latitude
var longitude = res.longitude
var speed = res.speed
var accuracy = res.accuracy
}
})
~~~
## 隨手記
> 隨手記錄:const類似var
傳遞參數(shù) 在data{}中聲明參數(shù),在onLoad里面去傳遞參數(shù)(賦值)
例:
~~~
data: {
pageNum:1
}
const _this=this
_this.setData({
pageNum:++_this.data.pageNum
})
~~~
- 關(guān)于我們
- ApiCloud
- 支付模塊
- 微信支付--wxPay(客戶端)
- 微信支付--wxPay(服務(wù)端)
- 支付寶支付--aliPay(客戶端配置)
- 支付寶支付--aliPay(服務(wù)端配置)
- DoT模板
- 緩存模塊
- 監(jiān)聽模塊
- 百度定位模塊
- 設(shè)置狀態(tài)欄字體顏色
- 選擇城市插件
- 跨頁面執(zhí)行方法
- 安卓-點擊返回事件
- 上傳圖片模塊
- 點擊彈出放大圖片層
- 魅族手機apiready問題
- 分享
- 跨win或frm執(zhí)行腳本
- 關(guān)于ios數(shù)字自動識別成手機號
- 百度地圖bMap
- 語音識別模塊
- tabBarMenu底部導航
- 第三方登錄
- QQ網(wǎng)站和appQQ賬號的統(tǒng)一問題解決
- 微信登錄
- QQ登錄
- 微博登錄
- 上拉加載、下拉刷新模塊
- 圖片緩存
- 文件和圖片緩存機制分享
- PHP
- 支付寶及時到賬
- no input file specified報錯解決
- thinkphp 整合kindeditor
- 整合tpshop微信模塊到thinkcmf中
- thinkphp3.1.3整合支付寶
- 網(wǎng)站接入QQ OAuth2.0登錄教程
- ThinkPHP整合百度編輯器Ueditor
- PHP加快執(zhí)行效率的寫法規(guī)范
- ThinkPHP操作大全
- PHP操作大全
- Thinkphp中SQL操作返回值
- php5.3 foreach 使用&(與運算符)引用賦值要注意的問題
- mysql給字段追加值
- 阿里大魚短信平臺接入
- Navicat 導出 Mysql 數(shù)據(jù)字典
- php 面向?qū)ο笕娼坛?/a>
- PHP5下調(diào)用SOAP
- PHP處理時間格式添加空格
- 偽裝URL請求(.htaccess)
- url請求參數(shù)加解密
- JS插件
- artDialog彈窗-頁面?zhèn)髦?/a>
- jQuery點擊遮罩彈出層固定居中
- jeBox原生彈窗
- bxslider輪播
- js生成指定位數(shù)隨機數(shù)
- 發(fā)送短信倒計時
- js調(diào)試
- jQuery.validator 表單驗證規(guī)則
- Swiper 輪播
- 獲得焦點時-圖片抖動
- uploadify無刷新上傳圖片
- 導航下拉隱藏上拉顯示
- 獲得焦點時-加黑色蒙版
- jquery.qrcode.js生成二維條形碼(支持中文)
- jquery.qrcode.js生成二維條形碼(官方不支持中文)
- nth-child 選擇器
- 無刷新點擊實現(xiàn)加載更多數(shù)據(jù)
- 刷新頁面方法
- 判斷滾動條向上向下
- 跨瀏覽器復制jQuery-zclip
- js校驗表單后提交表單的三種方法
- 用JS判斷下拉框是否選中
- div中滾動
- 提交時彈出模態(tài)框
- 當圖片不顯示時替換方法
- 前端
- CSS3
- HTML5
- css技巧
- 移動端rem
- Flex布局
- 電商詳情滾動條監(jiān)聽
- VueCircleMenu圓環(huán)按鈕
- iframe自適應頁面高度
- 百度Echart
- input:radio改變選中顏色
- Jquery
- 響應式布局基本實現(xiàn)Media Query
- 循環(huán)輸出只輸出新內(nèi)容
- 小程序
- wx.request坑
- 概要
- git操作
- 本地記住密碼
- 操作
- 生成ssh公鑰 記住密碼
- git避坑
- ES6學習手札
- 調(diào)試小插件
- 谷歌插件Postman
- PHP調(diào)試助手
- WordPress
- 緩存服務(wù)器Redis
- 在線代碼運行 Docker
- 在ubuntu下怎樣安裝https
- BrowserSync 瀏覽器同步測試工具
- getmarkman高效的設(shè)計稿標注、測量工具
- PHPstrom軟件
- 服務(wù)器
- linux 安裝搭建服務(wù)器配置及nginx配置
- tpshop的nginx 服務(wù)器配置方法
- (服務(wù)器訪問文件404解決辦法)IIS 之 添加MIME擴展類型及常用的MIME類型列表
- mysql部分
- mysql緩存
- MySql監(jiān)控工具--mytop
- MySql主從搭建
- mysql優(yōu)化
- Mysql 復制 (主從復制)
- iOS開發(fā)筆記 - 上線流程
- VUE避坑指南
- 從零開始學Vue
- Vue-cli
- Webpack
- VUE小記
- npm打包空白
- 打包背景圖片/項目圖片不顯示
- VUE避坑指南/elementUI upload 自定義http-request上傳
- 關(guān)于watch監(jiān)聽路由重復加載方法
- 解決加載內(nèi)容的時候閃動問題
- vuecli沒有network訪問地址
- python學習
- python初始
- pytho內(nèi)置函數(shù)大全
- win10 播放器播放TS文件問題
- 設(shè)計網(wǎng)站
- VUE避坑指南/VUE-CLI部署空白
- swiper使用問題
- uni-app學習手冊
- 目錄結(jié)構(gòu)
- layUI
- nodesass版本sassloader版本問題
