Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/talltotal/vue-wxqlogo
https://talltotal.github.io/vue-wxqlogo/
https://github.com/talltotal/vue-wxqlogo
qlogo vue wechat wx
Last synced: about 4 hours ago
JSON representation
https://talltotal.github.io/vue-wxqlogo/
- Host: GitHub
- URL: https://github.com/talltotal/vue-wxqlogo
- Owner: talltotal
- Created: 2019-10-15T11:23:14.000Z (about 5 years ago)
- Default Branch: master
- Last Pushed: 2022-12-11T09:46:40.000Z (almost 2 years ago)
- Last Synced: 2024-08-09T13:43:46.554Z (3 months ago)
- Topics: qlogo, vue, wechat, wx
- Language: JavaScript
- Homepage: https://www.npmjs.com/package/vue-wxqlogo
- Size: 1.2 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 25
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# vue-wxqlogo
微信头像“暂时无法查看”异常处理。
[demo](https://talltotal.github.io/vue-wxqlogo/)
## Installation
```bash
$ npm install vue-wxqlogo
```
OR
```bash
$ yarn add vue-wxqlogo
```
## Usage
main.js:
```js
import Vue from 'Vue'
import VueWxQlogo from 'vue-wxqlogo'
import VueLazyload from 'vue-lazyload'
/**
* options:
* 1. loadingImg |
* 2. defaultImg | string>
*/
Vue.use(VueWxQlogo, {
loadingImg: require('@/assets/imgs/loading'),
defaultImg (key) {
return [
require('@/assets/imgs/logo/1.png'),
require('@/assets/imgs/logo/2.png'),
require('@/assets/imgs/logo/3.png'),
][Number(key) % 3]
}
})
/**
* wxqlogo in VueLazyload
*/
Vue.use(VueLazyload, {
...lazyOptions,
adapter: {
loaded ({ el, src }) {
/**
* Vue.prototype.$loadWxqlogo
* 1. src |
* 2. key |
* 3. handler | <(result: string)=>void>
*/
Vue.prototype.$loadWxqlogo(src, key, (result) => {
el.setAttribute('src', result)
})
}
}
})
/**
* async-await (won't return 'loading' status)
*/
async function fun () {
const result = await Vue.prototype.$loadWxqlogo(src, key)
commit('SET_AVATAR', result)
}
```
template:
```html
![]()
![]()
![]()
```