vshare
vshare基于百度分享开发的支持VUE2.X的分享插件,为您带来更多的流量!提供多种风格按钮,代码加载更快,引入社会化流量,提升网页抓取速度等优点。github地址:https://github.com/1006008051/vshare,欢迎star。安装npm install vshare -S使用注入// ES6import vshare from 'vshar...
·
vshare
基于百度分享开发的支持VUE2.X的分享插件,为您带来更多的流量!提供多种风格按钮,代码加载更快,引入社会化流量,提升网页抓取速度等优点。
github地址:https://github.com/1006008051/vshare,欢迎star。
安装
npm install vshare -S
使用
注入
// ES6
import vshare from 'vshare'
//or require
var vshare = require('vshare')
Vue.use(vshare)
组件使用
<vshare></vshare>
默认展示
配置
// 组件
<vshare
:vshareConfig="vshareConfig"
>
</vshare>
// 数据
data () {
vshareConfig: {
shareList: [
// 此处放分享列表(ID)
],
common : {
//此处放置通用设置
},
share : [{
//此处放置分享按钮设置
}
],
slide : [
//此处放置浮窗分享设置
],
image : [
//此处放置图片分享设置
],
selectShare : [
//此处放置划词分享设置
]
}
}
vshareConfig
shareList
配置项名称 | 说明 | 类型 | 可选值 | 默认值 |
---|---|---|---|---|
---- | 此处放分享列表(ID) | array | mshare(一键分享 ) qzone(QQ空间) tsina(新浪微博 ) renren(人人网 ) tqq(腾讯微博 ) bdxc(百度相册 ) kaixin001(开心网 ) tqf(腾讯朋友 ) tieba(百度贴吧 ) douban(豆瓣网 ) tsohu(搜狐微博 ) bdhome(百度新首页 ) sqq(QQ好友 ) thx(和讯微博 ) bdysc(百度云收藏 ) meilishuo(美丽说 ) mogujie(蘑菇街 ) diandian(点点网 ) huaban(花瓣 ) duitang(堆糖 ) hx(和讯 ) fx(飞信 ) youdao(有道云笔记 ) sdo(麦库记事 ) qingbiji(轻笔记 ) people(人民微博 ) xinhua(新华微博 ) mail(邮件分享 ) isohu(我的搜狐 ) yaolan(摇篮空间 ) wealink(若邻网 ) ty(天涯社区 ) fbook(Facebook ) twi(Twitter) linkedin(linkedin) copy(复制网址 ) print(打印 ) ibaidu(百度个人中心 ) weixin(微信 ) iguba(股吧 ) | [‘more’, ‘qzone’, ‘tsina’, ‘tqq’, ‘renren’, ‘weixin’] |
common
配置项名称 | 说明 | 类型 | 可选值 | 默认值 |
---|---|---|---|---|
bdText | 分享的内容 | string | 自定义 | |
bdDesc | 分享的摘要 | string | 自定义 | |
bdUrl | 分享的Url地址 | string | 自定义 | |
bdPic | 分享的图片 | string | 自定义 | |
bdSign | ‘on’: 默认值,使用正常方式挂载回流签名(#[数字签名])‘off’: 关闭数字签名,不统计回流量’normal’: 使用&符号连接数字签名,不破坏原始url中的#锚点 | string | on off normal | |
bdMini | 下拉浮层中分享按钮的列数 | int | 1 2 3 | |
bdMiniList | 自定义下拉浮层中的分享按钮类型和排列顺序。 | array | 同shareList | |
onBeforeClick | 在用户点击分享按钮时执行代码,更改配置。cmd为分享目标id,config为当前设置,返回值为更新后的设置。 | function | function(cmd,config){} | |
onAfterClick | 在用户点击分享按钮后执行代码,cmd为分享目标id。可用于统计等。 | function | function(cmd){} | |
bdPopupOffsetLeft | 下拉浮层的y偏移量 | int | 正|负数 | |
bdPopupOffsetTop | 下拉浮层的x偏移量 | int | 正|负数 |
share
配置项名称 | 说明 | 类型 | 可选值 | 默认值 |
---|---|---|---|---|
tag | 表示该配置只会应用于data-tag值一致的分享按钮。如果不设置tag,该配置将应用于所有分享按钮。 | string | 与data-tag一致 | |
bdSize | 分享按钮的尺寸 | int | 16 24 32 | |
bdCustomStyle | 自定义样式,引入样式文件 | string | 样式文件地址 |
slide (如不需要不传参数或者传false)
配置项名称 | 说明 | 类型 | 可选值 | 默认值 |
---|---|---|---|---|
bdImg | 分享浮窗图标的颜色。 | string | 0 1 2 3 4 5 6 7 8 | |
bdPos | 分享浮窗的位置 | string | left right | |
bdTop | 分享浮窗与可是区域顶部的距离(px) | int |
image(如不需要不传参数或者传false)
配置项名称 | 说明 | 类型 | 可选值 | 默认值 |
---|---|---|---|---|
tag | 表示该配置只会应用于data-tag值一致的图片。如果不设置tag,该配置将应用于所有图片。 | string | 与data-tag一致 | |
viewType | 图片分享按钮样式。 | string | list collection | |
viewPos | 图片分享展示层的位置。 | string | top bottom | |
viewColor | 图片分享展示层的背景颜色。 | string | black white | |
viewSize | 图片分享展示层的图标大小。 | int | 16 24 32 | |
viewList | 自定义展示层中的分享按钮类型和排列顺序。 | array | 同shareList |
selectShare(如不需要不传参数或者传false)
配置项名称 | 说明 | 类型 | 可选值 | 默认值 |
---|---|---|---|---|
bdSelectMiniList | 自定义弹出浮层中的分享按钮类型和排列顺序。 | array | 同shareList | |
bdContainerClass | 自定义划词分享的激活区域。 | string | myclassname |
更多推荐
已为社区贡献38条内容
所有评论(0)