Micro letter applet tag embedded in the cover-view picture button does not show the problem

A problem arises

Development of small micro-channel, we need to cover a button image on the map component native, used to share (common demand). But understand that api, to cover the map component, only cover-viewcarried out. And official documents say very clearly, cover-viewthe interior is to be set button, and only by sharing buttoncomponents open-typewere. Write down the following code:

<cover-view class="share-cover-view">
    <button class = "share-button" style="background-image:url(https://csdnimg.cn/cdn/content-toolbar/csdn-logo_.png?v=20190924.1)"></button>
 </cover-view>
.share-cover-view{
  position: absolute;
  top:100px;
  right: 30px;
  width: 100px;
  height: 100px;
  .share-button{
     width:100px;
    height: 100px;
  }
}

To avoid into the pit, I also pay special attention to the use of the network picture (csdn the logo), but try the N times, can be normal in developer tools, but in the real machine test how all get out button.

wx.getSystemInfoInterface to obtain information is as follows.

SDKVersion: "2.10.1" version: "7.0.4" system: "iOS 10.0.1"

Here Insert Picture Description

Second, the problem is solved

Tried a variety of programs, I go to the community to ask questions, find a micro-channel cover-viewlabel Bug itself. The buttonbutton covers. Solutions are as follows:

<button class="share-button">
    <cover-image src="https://csdnimg.cn/cdn/content-toolbar/csdn-logo_.png?v=20190924.1"></cover-image>
 </button>

Use buttonbutton assembly as a root, and then used cover-imageas a picture display overlaid on top of the button. On-device debugging, everything ok.

In addition, in informing the community of developers, that mapcomponent has now achieved the same level, you can not use cover-view cover-imagethat is overlaid on top of it can be achieved.

 <view class ="cover-view-view">
    <button class = "share-button" style="background-image:url(https://csdnimg.cn/cdn/content-toolbar/csdn-logo_.png?v=20190924.1)"></button>
 </view>
.cover-view-view{
  position: absolute;
  top:100px;
  right: 30px;
  width: 100px;
  height: 100px;
  .share-button{
    width:100px;
    height: 100px;
  }
}

Instant feel good food. Such a simple question, is the main component map api introduced to fool

Third, the conclusion

Currently the program is really more than a small pit ah. Development model is actually very convenient, that is more than the pit.

Published 30 original articles · won praise 51 · views 10000 +

Guess you like

Origin blog.csdn.net/qq_29722281/article/details/104360576