xqshare
This is a js share libiary.
Install
Browser:
import cdn
<!-- style -->
<link rel="stylesheet" href="https://xqgj.cc/xqcdn/libs/xqshare/css/xqshare.min.css">
<!-- browser -->
<script src="https://xqgj.cc/xqcdn/libs/xqshare/js/xqshare.min.js"></script>
<!-- es module -->
<script type="module">
import xqshare from '../lib/js/xqshare-esm.min.js';
</script>Usage
Browser
- html
<div>
<button id="openBtn">share</button>
</div>
<div id="defaultShare"></div>
<div id="popShare"></div>
<div id="slideShare"></div>- call
// 1.default mode
let defaultShare = new XqShare({
el: '#defaultShare',
type: 'default',
});
// 2.pop mode
let popShare = new XqShare({
el: '#popShare',
type: 'pop',
});
let openBtn = document.querySelector('#openBtn');
openBtn.addEventListener('click', showShare, false);
function showShare () {
popShare.show();
}
// 3.slide mode
let slideShare = new XqShare({
el: '#slideShare',
type: 'slide',
});Vue
npm i xqshare// main.js
import xqshare from 'xqshare/lib/vue/index';
Vue.use(xqshare);<!-- xqshare start -->
<xq-share :type="type" :show="show" :title="title" :url="url"></xq-share>
<!-- xqshare end -->export default {
name: 'Demo',
data() {
return {
type: 'default', // must value: default slide pop
show: true, // must (pop is false, another is true)
title: '', // optional
url: '', // optional
}
}
}View xqshare
Run this script to view the demonstration case: npm run test:browser.