基於vue next vue3 企業微信H5搭建

2021-10-21 20:13:53 字數 3176 閱讀 9551

已有的移動端元件庫(vue)有。

根據實際需求,選擇適合自己的元件庫。個人推薦 vant。一直持續更新中。

利用的是postcss-pxtorem這個庫

vue.config.js裡面配置下就行了

module.exports =)]

}}}

利用的是babel-plugin-import元件

對於vant的配置

babel.config.js檔案裡面

module.exports =

,'vant',]

,],}

然後就可以按需引入元件了。

// 外掛程式會自動將**轉化為方式二中的按需引入形式

import from 'vant';

const oauthurl =

&redirect_uri=

$&response_type=code&scope=snsapi_base&state=state#wechat_redirect`

我使用的是vue-router庫,通過方法router.beforeeach()router.aftereach()攔截路由變化

在 beforeeach方法裡面

router.

beforeeach

((to,form,next)

=>);

}else

})

在 aftereach 方法裡面

router.aftereach((to,from,next)=>)
當執行了vue-cli

之後,生成了 dist 目錄之後,如何預覽呢,這個時候就需要乙個http服務,並支援**介面。

/**

* 使用nodejs建立本地的http服務

$/`);

這裡就是乙個最簡單的 http 服務,並依賴http-proxy庫 走api 的**。

對於 http的請求,我選擇的是axios這個庫,當然也有其他更好的庫選擇。

所使用的庫是 watermark-dom

vant 是乙個面向移動端的元件庫,因此預設只適配了移動端裝置,這意味著元件只監聽了移動端的 touch 事件,沒有監聽桌面端的 mouse 事件。

如果你需要在桌面端使用 vant,可以引入我們提供的@vant/touch-emulator,這個庫會在桌面端自動將 mouse 事件轉換成對應的 touch 事件,使得元件能夠在桌面端使用。

# 安裝模組

npm i @vant/touch-emulator -s

// 引入模組後自動生效

import '@vant/touch-emulator';

demo

github

ELK 企業搭建實戰 3

接上篇elk搭建文章 5 filebeat 隸屬於beats,輕量級資料收集引擎。基於原先 logstash fowarder 的原始碼改造出來。換句話說 filebeat就是新版的 logstash fowarder,目前beats包含四種工具 為什麼用 filebeat 而不用原來的 logst...

Monkey測試企業實戰(3)

1 指定需要進行monkey穩定性測試的包 adb shell monkey p com.kugou.android 500 2 指定monkey日誌檔案 adb shell monkey p com.kugou.android 1000 d test.txt 3 檢視monkey日誌中的內容 mo...

華為企業裝置基於DHCP relay的方式

dhcp relay實驗 華為 拓補案例 某個公司有三個部門,a,b,c,企業拓補結構是,ar華為路由器 s5700核心交換機,下面接s3700匯聚交換機,匯聚交換機下面接pc 要求pc端從全域性獲取ip位址,方式是dhcp relay,三個位址池分別是vlan10,20,30 請看拓補 route...