爱意满满的作品展示区。
backrunner

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

  •  
  •   backrunner · Aug 8, 2021 · 2641 views
    This topic created in 1747 days ago, the information mentioned may be changed or developed.

    现在 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 replies    2021-08-17 16:01:30 +08:00
    GG668v26Fd55CP5W
        1
    GG668v26Fd55CP5W  
       Aug 8, 2021 via iPhone
    怎么 demo 打开一片空白?手机 safari
    backrunner
        2
    backrunner  
    OP
       Aug 8, 2021
    @falcon05 刚才在部署新版本 cdn 有点问题 现在应该 ok 了
    Danswerme
        3
    Danswerme  
       Aug 8, 2021
    @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
       Aug 8, 2021
    @Danswerme 本来想直接用一个生产环境的情况做 demo,看来还是不行
    https://backrunner.github.io/vue-share-popup/
    用 gh-pages 跑了项目里的 demo 看这个吧
    Danswerme
        5
    Danswerme  
       Aug 8, 2021 via iPhone
    @backrunner 这个试过了,ok 的。
    ibegyourpardon
        6
    ibegyourpardon  
       Aug 17, 2021
    东西是挺好。

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

    我比较懒,都是直接复制了 url 发过去给别人。。
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   5411 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 1378ms · UTC 03:45 · PVG 11:45 · LAX 20:45 · JFK 23:45
    ♥ Do have faith in what you're doing.