當前位置:網站首頁>微信小程序中使用第三方庫的方法

微信小程序中使用第三方庫的方法

2022-01-28 01:43:37 gxhlh

最近在做一個小程序項目,想在小程序中使用dayjs,所以需要在小程序中引入第三方庫(被自己蠢哭了,記錄一下)

1、無法通過 <script> 標簽引入

小程序和網頁開發都依賴 javascript,但是所用的 javascript 有所不同,因為小程序沒有 DOM 和 BOM 對象所以,前端開發非常熟悉的一些庫,例如 jQuery、 Zepto 等,在小程序中是無法運行的。因為小程序的框架和 NPM 與 Native 的不同,一些 NPM 的包在小程序中也是無法運行的。

在這裏插入圖片描述

小程序的主要開發語言是 JavaScript
​網頁開發渲染線程和脚本線程是互斥的,這也是為什麼長時間的脚本運行可能會導致頁面失去響應,
而在小程序中,二者是分開的,分別運行在不同的線程中。

網頁開發者可以使用到各種瀏覽器暴露出來的 DOM API,進行 DOM 選中和操作。而如上文所述,小程序的邏輯層和渲染層是分開的,邏輯層運行在 JSCore 中,並沒有一個完整瀏覽器對象,因而缺少相關的DOM API和BOM API。
在這裏插入圖片描述

WXS(WeiXin Script)是小程序的一套脚本語言,結合 WXML,可以構建出頁面的結構。
注意

  • WXS 不依賴於運行時的基礎庫版本,可以在所有版本的小程序中運行。
  • WXS 與 JavaScript 是不同的語言,有自己的語法,並不和 JavaScript 一致。
  • WXS 的運行環境和其他 JavaScript 代碼是隔離的,WXS 中不能調用其他 JavaScript 文件中定義的函數,也不能調用小程序提供的API。
  • WXS 函數不能作為組件的事件回調。
  • 由於運行環境的差异,在 iOS 設備上小程序內的 WXS 會比 JavaScript 代碼快 2 ~ 20 倍。在 android 設備上二者運行效率無差异。
  • 以下是一些使用 WXS 的簡單示例,要完整了解 WXS 語法,請參考WXS 語法參考

所以目前 wxs 還不能引入外部 js 文件

2、通過 npm 下載

Step 1:下載

npm install dayjs --save

Step 2 : 構建 npm

點擊開發者工具菜單【工具】- 【構建 NPM】

Step 3 : JS 中引入

var dayjs = require('dayjs')

然後,我們就可以用 dayjs 了

let bol=dayjs().isBefore(dayjs('2021-12-15'));

3、通過 import 導入

首先要把 dayjs 文件下載下來保存在文件中

使用時

// 在所需使用dayjs的js文件引入此文件
import dayjs from '../../lib/dayjs.min.js'

// 然後在js文件中可直接使用
this.data.showTotalTime = dayjs(bg.duration * 1000).format('mm:ss')

版權聲明
本文為[gxhlh]所創,轉載請帶上原文鏈接,感謝
https://cht.chowdera.com/2022/01/202201280143369926.html

隨機推薦