勘探-微信小程序

mini-program

勘探-微信小程序

註冊小程序帳號

前往官網註冊--流程簡單，不贅述.

在網站的「設置」-「開發者設置」中,獲得AppId

下載開發者工具

mac

window 32

windows 64

經過開發者工具建立小程序

文件結構

小程序有全局的配置、樣式、邏輯也有每一個頁面本身的配置、樣式、邏輯文件

app.json: 全局配置--(小程序公共設置)

app.js: 全局配置--(小程序邏輯)

app.wxss: 全局配置--(小程序公共樣式)

pages: 頁面數組--(小程序可單獨有本身的配置、樣式、邏輯文件，還有一個頁面結構文件)

配置部分注意項~

配置部分相對簡單，So 只列出以下注意點，順帶附上我的配置：

爲了方便開發者減小配置項，咱們規定描述頁面的這四個文件必須具備相同的路徑與文件名。

每增長一個頁面，必須在全局app.json文件pages參數下增長對應路徑配置！

若是有菜單項，強制要求控制在2-5個！

若是配置菜單必須把小程序初始頁面配成菜單list其中一個，不然沒法顯示菜單！！

邏輯層

函數	出現位置	可能值	說明
App()	app.js	1. 小程序生命週期函數<br/>2. 自定義函數<br/>3. 數據	1.其中自定義函數和數據爲全局的<br/> 2.本文件內經過this調用自定義函數和數據，其餘文件須要getApp()或者實例後調用
Page()	pages下的頁面內	1. 初始數據<br/>2.頁面生命週期函數<br/>3.自定義函數<br/>4.數據	1. Page.prototype.route能夠獲取當前路由路徑<br/>2.Page.prototype.setData()可更改數據，並相應到視圖層，<br/>直接修改this.data不會更新到頁面，且單次設置數據不能超過1024kb。
模塊化		1.module.exports(推薦) 2.exports	1. 文件具備單獨做用域<br/>2.能夠抽離公共代碼module.exports 或者 exports對外暴露接口<br/>3.不支持絕對路徑以及node_modules
路由			在小程序中全部頁面的路由所有由框架進行管理。
場景值			自行查看文檔
API			自行查看文檔

有興趣的話能夠自行去了解一下 【前臺、後臺定義】以及【銷燬小程序的時機】

老規矩，剩下的列出須要注意的點：

App() 必須在 app.js 中註冊，且不能註冊多個。

不要在定義於 App() 內的函數中調用 getApp() ，使用 this 就能夠拿到 app 實例。

不要在 onLaunch 的時候調用 getCurrentPages()，此時 page 尚未生成。>

經過 getApp() 獲取實例以後，不要私自調用生命週期函數。

WXML

語法	說明	注意	eg
{{}}	1. 用於data對象下存在的字段 出現的位置 <br/> 2. 支持簡單計算及組合	1. 關鍵字(須要在雙引號以內) <br/> 2. 花括號和引號之間若是有空格，將最終被解析成爲字符串	1. <checkbox checked="{{false}}"> </checkbox> ，不加{{}}會當成字符串false而斷定爲true <br/> 2. <view>{{"hello" + name}}</view>
wx:for	循環數組	默認數組的當前項的下標變量名默認爲 index，數組當前項的變量名默認爲 item
block wx:for	渲染一個包含多節點的結構塊。
wx:key	指定列表中項目的惟一的標識符。
wx:if <br/> wx:elif <br/> wx:else <br/> wx:if vs hidden	1. 條件渲染 <br/> 2. wx:if 有更高的切換消耗而 hidden 有更高的初始渲染消耗		1. <view wx:if="{{condition}}"> True </view>
block wx:if	方便總體控制
template	1. 定義代碼片斷 <br/> 2. name屬性定義模板名字<br/> 3. is屬性聲明須要的使用的模板並須要傳入data <br/> 4. 模板有本身的做用域，只能使用data傳入數據
import和include	1. import引用目前文件定義的模板 <br/> 2. include能夠將目標文件除了<template/>的整個代碼引入，至關因而拷貝到include位置	1. import 有做用域的概念，即只會 import 目標文件中定義的 template，而不會 import 目標文件 import 的 template。
事件	1. touchstart、touchmove、touchcancel、touchend、、taplongtap <br/> 2. 如無特殊說明，當組件觸發事件時，邏輯層綁定該事件的處理函數會收到一個事件對象。(說白了，就是綁定事件js位置會帶一個對象，其中包括不少屬性)	bind事件綁定不會阻止冒泡事件向上冒泡，catch事件綁定能夠阻止冒泡事件向上冒泡。	bindtap <br/> catchtouchstart

WXSS和組件等持續更新中...

以爲還不錯就點個贊吧~