V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
爱意满满的作品展示区。
backrunner
V2EX  ›  分享创造

一个 Vue 2 & 3 都能用的社会化分享 Popup

  •  
  •   backrunner · 2021-08-08 13:05:45 +08:00 · 1889 次点击
    这是一个创建于 1202 天前的主题,其中的信息可能已经有所发展或是发生改变。

    现在 QQ 空间、豆瓣、微博之类的平台仍然保留了一个网页上的分享页面,一些站点仍然在使用 Need More Share 去拉起这些分享页面做社会化分享。

    虽然 Need More Share 是纯 JS 编写,没有其他依赖,但是结合 Vue 开发的站点一起使用,我个人认为它用起来不够灵活,而且涉及到条件渲染,使用会变得更加复杂。

    为了简化社会化分享在 Vue 内的使用,我基于 vue-demi 写了一个同时兼容 Vue 2 和 Vue 3 的社会化分享 Popup,给它起名为了 vue-share-popup 。

    这个包 v0.4.0 后的版本是支持 tree-shaking 的。

    现阶段主要支持的是国内主流平台,海外平台目前只做了 Twitter,后续在加上其他的。

    GitHub: vue-share-popup

    Live demo: pixiviz share demo

    ScreenShot:

    screenshot

    对这个项目感兴趣的朋友可以点个 star~

    6 条回复    2021-08-17 16:01:30 +08:00
    falcon05
        1
    falcon05  
       2021-08-08 13:10:08 +08:00 via iPhone
    怎么 demo 打开一片空白?手机 safari
    backrunner
        2
    backrunner  
    OP
       2021-08-08 14:18:02 +08:00
    @falcon05 刚才在部署新版本 cdn 有点问题 现在应该 ok 了
    Danswerme
        3
    Danswerme  
       2021-08-08 15:49:56 +08:00
    @backrunner 还是炸的嗷,macOS Safari 14.1.2
    ```
    TypeError: undefined is not an object (evaluating 'screen.orientation.type')
    TypeError: undefined is not an object (evaluating 'e.relatedImages.length')
    TypeError: undefined is not an object (evaluating 'this.image.title')
    ```
    backrunner
        4
    backrunner  
    OP
       2021-08-08 17:38:36 +08:00
    @Danswerme 本来想直接用一个生产环境的情况做 demo,看来还是不行
    https://backrunner.github.io/vue-share-popup/
    用 gh-pages 跑了项目里的 demo 看这个吧
    Danswerme
        5
    Danswerme  
       2021-08-08 17:39:20 +08:00 via iPhone
    @backrunner 这个试过了,ok 的。
    ibegyourpardon
        6
    ibegyourpardon  
       2021-08-17 16:01:30 +08:00
    东西是挺好。

    我只是好奇,大家平时真的会在 web 端这样分享吗?

    我比较懒,都是直接复制了 url 发过去给别人。。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2569 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 23ms · UTC 04:54 · PVG 12:54 · LAX 20:54 · JFK 23:54
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.