收藏
回答

wx-open-launch-weapp 在弹窗组件中不显示按钮?

微信版本:7.0.17

安卓版本:10.0

微信JSSDK版本:1.6.0

项目是用vue写的,UI框架是VUX

这个页面一共有5个标签,分别是【打开小程序0/1/2/3/4】

其中0/1可以显示,2/3/4不能显示

0是用div包裹的,1是用cell-box包裹的,2/3/4是写在弹窗里面的,弹窗组件通过v-transfer-dom指令把弹窗元素移到了body下面

有问题的链接:https://class.acagrid.com/promote/debug_test

我已经手动设置了标签的宽高,内容文字还是没有显示出来

模板代码如下:

    <div style="height: 30px;">div>
    <div class="text" @click="show_popup=true">准备好的标签:{{ready_btns}}div>
    <div style="height: 30px;">div>
    <div class="text" @click="show_popup=true">打开弹窗div>
    <div style="height: 30px;">div>


    <div class="text">
      <wx-open-launch-weapp class="weapp-wrap" id="launch-btn0" :username="mm_id" path="pages/image_uploader/index.html?token=vip" @ready="weappReady(0)">
        <script type="text/wxtag-template">
          <style>
            .diy-style {
              display: block;
              text-align: center;
              font-size18px;
              line-height25px;
              text-align: center;
              color#000000;
              width100%;
            }
          style>
          <div class="diy-style">打开小程序0div>
        script>
      wx-open-launch-weapp>
    div>



    <group :gutter="0">
      <cell-box class="need-active" :border-intent="false">
        <wx-open-launch-weapp class="weapp-wrap" id="launch-btn1" :username="mm_id" :path="mm_path" @ready="weappReady(1)" @launch="startMP" @error="errorMPOpen">
          <script type="text/wxtag-template">
            <style>
              .diy-style {
                display: block;
                text-align: center;
                font-size18px;
                line-height25px;
                text-align: center;
                color#000000;
                width100%;
              }
            style>
            <div class="diy-style">打开小程序1div>
          script>
        wx-open-launch-weapp>
      cell-box>


    group>


    <popup 
      v-transfer-dom
      v-model="show_popup" 
      :show-mask="true"
      class="upload-options-selector">
      <div class="popup-content">
        <group :gutter="0">
          <cell-box class="need-active" :border-intent="false" @click.native="clickCamera">
            <div class="pop-option">拍摄div>
          cell-box>
          <cell-box class="need-active" :border-intent="false" @click.native="clickAlbum">
            <div class="pop-option">相册选择div>
          cell-box>
          <cell-box class="need-active" :border-intent="false">
            <wx-open-launch-weapp class="weapp-wrap" id="launch-btn2" :username="mm_id" :path="mm_path" @ready="weappReady(2)" @launch="startMP" @error="errorMPOpen">
              <script type="text/wxtag-template">
                <style>
                  .diy-style {
                    display: block;
                    text-align: center;
                    font-size18px;
                    line-height25px;
                    text-align: center;
                    color#000000;
                    width100%;
                  }
                style>
                <div class="diy-style">打开小程序2div>
              script>
            wx-open-launch-weapp>
          cell-box>
          <cell-box class="need-active" :border-intent="false">
            <wx-open-launch-weapp class="weapp-wrap" id="launch-btn3" :username="mm_id" :path="mm_path" @ready="weappReady(3)" @launch="startMP" @error="errorMPOpen">
              <template>
                <div class="diy-style">打开小程序3div>
              template>
            wx-open-launch-weapp>
          cell-box>
          <cell-box class="need-active" :border-intent="false">
            <wx-open-launch-weapp class="weapp-wrap" id="launch-btn4" :username="mm_id" :path="mm_path" @ready="weappReady(4)" @launch="startMP" @error="errorMPOpen">
              <script type="text/wxtag-template">
                <div class="diy-style">打开小程序4div>
              script>
            wx-open-launch-weapp>
          cell-box>


        group>
        <group :gutter="6">
          <cell-box class="need-active" :border-intent="false" @click.native="show_popup=false">
            <div class="pop-option">取消div>
          cell-box>
        group>
      div>
    popup>
回答关注问题邀请回答
收藏

2 个回答

  • 睡前原谅一切
    睡前原谅一切
    2020-08-04

    我记得有说 不让用定位 以及 transform等操作。你这个可能是移到父容器外了。

    2020-08-04
    有用 1
    回复 22
    • Pandex
      Pandex
      2020-08-04
      那把的父元素用postion:fixed;定位可以吗
      2020-08-04
      回复
    • 睡前原谅一切
      睡前原谅一切
      2020-08-04回复Pandex
      这个只能你操作试下了,因为我们的没那么复杂。。就页面正常布局显示一个按钮。所以你这个场景没试过。。
      2020-08-04
      回复
    • Pandex
      Pandex
      2020-08-04
      好的,谢谢,我再试一下。之前踩坑无数才让按钮显示出来,现在居然没办法按照产品设计来做。。
      2020-08-04
      回复
    • 睡前原谅一切
      睡前原谅一切
      2020-08-04回复Pandex
      我也是踩了好多坑。最后发现初始化生成时间戳那个接口 我用的个人测试号。太难了,
      2020-08-04
      回复
    • Pandex
      Pandex
      2020-08-04回复睡前原谅一切
      我也用的个人测试号搞了半天,结果只能发布到生产才能显示
      2020-08-04
      回复
    查看更多(17)
  • Dong
    Dong
    2021-04-26

    弹窗不显示这个问题最终怎么解决的

    2021-04-26
    有用
    回复 2
    • shawn.Yon
      shawn.Yon
      2021-11-25
      请问您解决了吗?我目前用的是 https://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=sandbox/login 生成的个人测试公众号的appID 点了没有出现弹框,是否是个人测试公众号的原因?
      2021-11-25
      回复
    • shawn.Yon
      shawn.Yon
      2021-11-25回复shawn.Yon
      回一下自己,之前按钮不显示,点击没反应的问题,都是因为不能用个人测试的公众号,而是要拿已验证的公众号,按照官方的例子来写就可以了,现在解决啦!!
      2021-11-25
      回复
登录 后发表内容
问题标签