uniapp怎么实现微信QQ的分享图文分享组件,分享后最下方不显示HBuilder

要实现微信、QQ的图文分享，可以借助uniapp的uni-share组件。这里提供一个简单的实现步骤：

1. 在`manifest.json`文件中，添加微信、QQ的appid和对应的uni-share配置。

{
  "app-plus": {
    "share": {
      "weixin": {
        "appid": "wx0000000000000000",
        "appSecret": "00000000000000000000000000000000",
        "appName": "应用名称",
        "imgUrl": "图标地址",
        "scope": "snsapi_userinfo",
        "redirect_url": "http://www.example.com"
      },
      "qq": {
        "appid": "0000000",
        "appKey": "00000000000000000000000000000000",
        "title": "标题",
        "description": "描述",
        "imgUrl": "图标地址",
        "shareUrl": "分享链接",
        "scene": "QQ"
      }
    }
  }
}

2. 在需要分享的页面，引入uni-share组件，并通过`uni.share`方法触发分享。

<template>
  <view>
    <button @click="shareWechat">微信分享</button>
    <button @click="shareQQ">QQ分享</button>
  </view>
</template>

<script>
  import uniShare from '@/components/uni-share/uni-share.vue'

  export default {
    components: {
      uniShare
    },
    methods: {
      shareWechat () {
        uni.share({
          provider: 'weixin',
          type: 5, // 分享类型，图文
          title: '分享标题',
          summary: '分享描述',
          href: '分享链接',
          imageUrl: '分享图标地址',
          success () {
            console.log('分享成功')
          },
          fail () {
            console.log('分享失败')
          }
        })
      },
      shareQQ () {
        uni.share({
          provider: 'qq',
          type: 5, // 分享类型，图文
          title: '分享标题',
          summary: '分享描述',
          href: '分享链接',
          imageUrl: '分享图标地址',
          success () {
            console.log('分享成功')
          },
          fail () {
            console.log('分享失败')
          }
        })
      }
    }
  }
</script>

3. 如果分享后最下方仍然显示`HBuilder`，可以在`App.vue`中的`onShow`方法中添加如下代码：

// App.vue
export default {
  onShow () {
    setTimeout(() => {
      // 隐藏页面底部的 HBuilderX 字样
      uni.hideTabBar({})
    }, 500)
  }
}

以上就是一个简单的uniapp微信、QQ图文分享的实现方法。