ミニプログラムキャンバス非表示問題の解決

誰もが画像を生成するためにキャンバスを使用する必要性に何度も遭遇すると思います。
もちろん私もそれに遭遇しました。プロジェクトの wxml ページでキャンバスを生成した後、CSS を追加する方法を知りましたCanvas タグに追加します。キャンバスがページに影響するのを防ぐことはできません。

  <canvas    style="opacity:0;position:fixed;z-index:-9999;">
    // 无论是opacity  还是  z-index 都无法解决,多多少少会影响
   </canvas>

しばらく考えた結果、次の 解決策を思いつきました。 canvas の外層に親タグを追加し、親タグの表示を制御します

<view  style="width:0px;height:0px; overflow:hidden"> //让父标签 0宽 0高 隐藏溢出
    <canvas >
    </canvas>
</view>

上記が機能しない場合は、以下を参照してください。

  <canvas style="position:fixed:left:9999px" >
// 直接让canvas 飞到天际,  简单粗暴;   使用时注意 position的问题; 如果 fixed不行, 换其他定位试试
    </canvas>

ok .. さあ、コードを書いてください...

推奨チュートリアル: "

WeChat ミニ プログラム

>>

以上がミニプログラムキャンバス非表示問題の解決の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。