微信小程式從零開始開發步驟(七)引入外部js 檔案
上一章講到小程式頁面的四種常見的跳轉的方法,這一章寫如何引入一個外部的js檔案,既utils資料夾的用處,其實步驟很簡單:
1:準備好外部想要引入的外部檔案,命名為util.js,並且填充固定的檔案內容(一般是固定的庫)
圖片.png2:開啟util.js ,繼續填寫重要內容將要使用的方法用module.exports給暴露出來,如圖所示(我暴露了一個方法: imageUtil,若有很多方法,則用json形式)
module.exports = { imageUtil: imageUtil}
圖片.png3:將外部js放在指定的資料夾utils裡(utils 規定存放js庫和數字格式化檔案)
圖片.png4:在想要用到這個方法的js裡面 require這個js,然後呼叫即可(我在index.js檔案裡面想要呼叫外部檔案util.js,則先要獲取應用例項 :var imageUtil = require('../../utils/util.js')
文末福利:
90後前端妹子,愛程式設計,愛運營,愛折騰。堅持總結工作中遇到的技術問題,堅持記錄工作中所所思所見,歡迎大家一起探討交流。
相關推薦
微信小程式從零開始開發步驟(七)引入外部js 檔案
上一章講到小程式頁面的四種常見的跳轉的方法,這一章寫如何引入一個外部的js檔案,既utils資料夾的用處,其實步驟很簡單:1:準備好外部想要引入的外部檔案,命名為util.js,並且填充固定的檔案內容(一般是固定的庫)圖片.png2:開啟util.js ,繼續填寫重要內容將要使用的方法
微信小程式從零開始開發步驟(八)引入框架WeUI
首先來看下WeUI的官方介紹:WeUI 是一套同微信原生視覺體驗一致的基礎樣式庫,由微信官方設計團隊為微信內網頁和微信小程式量身設計,令使用者的使用感知更加統一。在微信小程式的開發過程中,涉及到的前端複雜的樣式介面的問題,就需要使用個UI框架,這樣可以省去以後很多麻煩。WeUI作為一個
微信小程式從零開始開發步驟(二)
上一章註冊完小程式,新增新建的專案,大致的準備開發已經完成,本章要分享的是要建立一個簡單的頁面了,建立小程式頁面的具體幾個步驟:1. 在pages 中新增一個目錄選中page,右擊滑鼠,從硬碟開啟,開啟硬碟檔案之後,新建一個資料夾test(或者點選+號,逐個新增目錄,新增目錄下面所需要
微信小程式從零開始開發步驟(三)底部導航欄
上一章節,我們分享瞭如何建立一個新的頁面和設定頁面的標題,這一章我們來聊聊底部導航欄是如何實現的。即點選底部的導航,會實現不同對應頁面之間的切換。 我們先來看個我們要實現的底部導航欄的效果圖:(三個導航圖示示例,微信小程式最多能加5個) 1. 圖標準備
微信小程式從零開始開發步驟(六)4種頁面跳轉的方法
四種跳轉的方法,在index裡面寫下一段程式碼進行測試 1:從首頁跳轉到日誌頁面(可以返回) (注意,在沒有設定底部導航的情況下,沒有tab也可使用這個屬性,有tab頁則需更換switchTab屬性) <view> <navigator
微信小程式從零開始開發步驟(四)自定義分享的功能
上一章節,實現了小程式的底部導航的功能,這一節開始實現一些簡單的功能。本章節介紹的是小程式的自定義分享的功能。 可以分享小程式的任何一個頁面給好友或群聊。注意是分享給好友或群聊,並沒有分享到朋友圈。一方面微信在嘗試流量分發方式,但同時又不願意開放最大的流量入口。
微信小程式從零開始開發步驟(一)
從零到有寫一個小程式系列專題,很早以前就想寫來分享,但由於專案一直在進展,沒有過多的時間研究技術,現在可以繼續分享了。1:註冊用沒有註冊過微信公眾平臺的郵箱註冊一個微信公眾號, 申請帳號 ,點選 https://mp.weixin.qq.com/wxopen/waregister?ac
微信小程式從零開始開發步驟(二)建立小程式頁面
上一章註冊完小程式,新增新建的專案,大致的準備開發已經完成,本章要分享的是 要建立一個簡單的頁面了,建立小程式頁面的具體幾個步驟: 1. 在pages 中新增一個目錄 選中page,右擊滑鼠,從硬碟開啟,開啟硬碟檔案之後,新建一個資料夾test(或者點選+號,逐個新增目錄
微信小程式-從零開始新建一個專案
新建時,不勾選【建立普通快捷啟動模板】 在根目錄下建立3個應用程式檔案 app.json app.js app.wxss 在根目錄下建立pages檔案, 在pages檔案下建立welcome資料夾並建立四個頁面檔案 welcome.js
微信小程式-從零開始製作一個跑步微信小程式
一、準備工作 1、註冊一個小程式賬號,得用一個沒註冊過公眾號的郵箱註冊。 2、註冊過程中需要很多認證,有很多認證,比較繁瑣,如果暫時只是開發測試,不進行提審、釋出的話,只要完成營業執照號填寫就可以了,不需要完成微信認證。 3、註冊完賬號,登入,在主頁面左邊列表中點選設定,然後再
微信小程式例項——天氣預報開發筆記(進行中...)
★ 背景 【提示】:正在補充更新中… 首先,附上一張效果圖. 之前就有關注過小程式的發展,感覺可以抽一點的時間來學習一下,通過官方文件以及提供的示例 Demo,發現興趣挺高,不失為一個
微信小程式--Web-View重新整理Html頁面(改)
最近進行小程式開發,因為主體上是複用了公眾號的內容,所有采用了Web-View載入H5的方式進行,其中有一個需求是連線藍芽裝置收集資料並上傳到後臺,點選H5中的按鈕,進入到藍芽採集頁面,然後在採集完資料後,跳回H5頁面並重新整理。 在H5中呼叫wx.miniProgram.navigateT
微信小程式彈出層的實現(動畫)
彈出層wxml頁面結構 <view class='couponLayerBox' animation="{{animMaskData}}" style='height:{{LayerBoxHeight}};'></view> &
【小程式】微信小程式使用騰訊雲IM(三):歷史訊息展示
類似微信聊天向上滾動逐漸顯示歷史訊息功能 1.第一步:得到歷史訊息。 得到歷史訊息在值錢的部落格裡寫著有,就不再寫一次了。這裡我可以寫一下聊天介面。就類似於微信或者QQ聊天的這種大眾化審美的樣式。 進入正題 當我獲取了當前的10條訊息後,將訊
【小程式】微信小程式使用騰訊雲IM(一):登入
微信小程式使用騰訊雲IM 新專案已經寫了很久啦 這個專案裡主要的難點其實是1v1聊天。他們對比了好幾家的即時通訊,最後選擇了騰訊雲通訊。我猜,可能是因為騰訊雲上說日活低於10w可以不付費吧。省錢嘛~踩坑踩了大概一週多兩週了,就把一些步驟寫下來,萬一以後也會用
從零開始學caffe(七):利用GoogleNet實現影象識別
一、準備模型 在這裡,我們利用已經訓練好的Googlenet進行物體影象的識別,進入Googlenet的GitHub地址,進入models資料夾,選擇Googlenet 點選Googlenet的模型下載地址下載該模型到電腦中。 模型結構 在這裡,我們利用之前講
微信小程式從開始到正式上線流程
這段時間完成了兩個上線的微信小程式,從前端到後臺總結一下 1.註冊微信公眾平臺賬號 https://mp.weixin.qq.com/ (只是想玩玩的不註冊也行,直接下載微信開發工具生成測試AppID就行) 之後開發要用到的AppID、AppSecret都在 設定 - 開發設定 目錄下
微信小程式之:雲開發初體驗--致我的第一個小程式
背景:一直關注微信小程式的發展,看著小程式一步步完善,一步步壯大,心裡癢癢,也想做一個自己的微信小程式,但是苦於只會前端,不會服務端,所以想法一直被卡著。現在小程式有了雲開發,很輕鬆實現後端功能,寫後端跟寫前端沒啥區別,真的是前端小夥伴們的福音啊。 經過幾個晚上的熬夜奮戰,我的第一個微信小程式正式
微信小程式從子頁面返回父頁面實現資料的區域性重新整理
問題描述 A頁面有一個儲存欄位的物件陣列items,從A頁面跳轉到B頁面,B頁面自定義欄位,並新增到items中。當返回A頁面時,顯示items的部分能夠區域性重新整理 items:[{name: '0', value: '姓名', checked: true, isNecessar
微信小程式從入門第一講 java&&jFinal 小程式登陸功能實現以及獲取唯一標識openid和unionid
在我以前的一篇部落格中講到了獲取openid的方法,這裡就不做過多的講解java獲取微信小程式openid。這裡主要講解微信小程式登陸的實現和獲取unionid。需要提醒的是我後端框架使用的是jFinal,傳值方式跟spring的那套有些許的差別。 1、首先要知道微信小程式的開發本身就是基於