0.1.8 • Published 4 months ago

vue3-social-share v0.1.8

Weekly downloads
-
License
MIT
Repository
github
Last release
4 months ago

vue3-social-share

作者:PeterAlbus

@Author PeterAlbus

联系邮箱:wuhongdb@163.com

协议及开源库使用

MIT License

网页二维码的生成使用'qrcodejs2'(qrcodejs2 - npm (npmjs.com)) 在0.1.4后修改为了'qrcode.vue',对vite也拥有了支持

0.1.7进行了优化,使得传入的参数会自动进行url编码

分享栏的图标参考share.js——overtrue/share.js (github.com)

简介

使用该组件需要Vue版本 > 3.2, Vue2用户可使用vue-social-share

使用本组件可以快速获得一个分享栏用于分享当前页面

image-20220123125719460

没什么技术含量,使用TypeScript编写。

如果有高度定制需求可以自己写,原理就是打开这些软件提供的分享链接。

支持:QQ、微博、微信、QQ空间、豆瓣、领英、点点、Facebook、推特、谷歌+

快速开始

安装

npm i vue3-social-share -S

引入

全局引入,在main.js中

import PeterAlbusVue from 'vue3-social-share';
import 'vue3-social-share/lib/index.css'

或按组件单个引用(实际上本库仅有一个组件),在.vue文件中

<script>
import {Share} from 'vue3-social-share';
import 'vue3-social-share/lib/index.css'
    
export default{
    name:'viewName',
    component:{
        Share
    }
}
</script>

使用

<templete>
    <Share></Share>
</templete>

或带上参数

<templete>
    <Share
		:url="baseUrl+blog.blogId"
		:title="blog.blogTitle"
		source="modifySource"
		:description="blog.blogDescription"
		:image="blog.blogImg"
		:twitter="true"
		:google="true"
	></Share>
</templete>

Props 参数列表

prop作用默认值类型
url分享出去的网页链接location.hrefString
source来源String
origin网站地址location.orginString
title分享标题document.titleString
description分享描述String
image图片urlString
QQ是否显示QQ的分享图标trueBoolean
weibo是否显示新浪微博的分享图标trueBoolean
weChat是否显示微信的分享图标trueBoolean
douban是否显示豆瓣的分享图标falseBoolean
QZone是否显示QQ空间的分享图标trueBoolean
linkedin是否显示领英的分享图标falseBoolean
diandian是否显示点点的分享图标falseBoolean
facebook是否显示脸书的分享图标falseBoolean
twitter是否显示推特的分享图标falseBoolean
google是否显示Google+的分享图标falseBoolean
0.1.8

4 months ago

0.1.7

2 years ago

0.1.6

2 years ago

0.1.5

2 years ago

0.1.4

2 years ago

0.1.3

2 years ago

0.1.2

2 years ago

0.1.1

2 years ago

0.1.0

2 years ago

0.0.11

2 years ago

0.0.10

2 years ago

0.0.9

2 years ago

0.0.6

2 years ago

0.0.5

2 years ago

0.0.4

2 years ago

0.0.3

2 years ago

0.0.2

2 years ago

0.0.1

2 years ago

1.0.1

2 years ago

1.0.0

2 years ago