ホームページ > 記事 > WeChat アプレット > WeChat アプレット コンポーネント: トースト表示メッセージ プロンプト ボックスの解釈と分析
トーストにはメッセージ プロンプト ボックスのコンポーネントの説明が表示されます:
トーストは、ユーザーが特定のコンポーネントをクリックしたときにポップアップするプロンプト メッセージです。トーストは、これらのメッセージの作成と表示に役立ちます。トーストは、単純なメッセージ プロンプト ボックスです。ビューがユーザーに表示されると、アプリケーション内でフロートとして表示されます。ミニ プログラムは Toast コンポーネントを放棄しようとしているので、ここで Toast API を紹介します: wx.showToast
Toast はメッセージ プロンプト ボックス コンポーネントを表示します。サンプル コードの実行効果は次のとおりです。 WXML コード:
<!--index.下面是WXML代码:--> <view class="content"> <text class="showfunc">Toast功能</text> <view class="con-button"> <button class="button-left" bindtap="showToast">展示Toast</button> <button class="button-right" bindtap="hideToast">隐藏Toast</button> </view> </view>
以下は JS コードです:
Page({ showToast:function(){ var that=this; wx.showToast({ title: '成功', icon: 'success', duration: 2000, success: that.flySuccess, fail:that.flyFail, complete:that.flyComplete }) }, hideToast:function(){ var that=this; wx.showToast({ title: '加载中', icon: 'loading', duration: 10000, success: that.loadingSuccess, fail:that.loadingFail, complete:that.loadingComplete }); setTimeout(function(){ wx.hideToast() },2000) },WXSS コードは次のとおりです:
/**index.下面是WXSS代码:**/ .con-button{ display: flex; flex-direction: row; padding-top: 10%; } .showfunc{ padding-top:10%; display: block; text-align: center; color: green; }
以上がWeChat アプレット コンポーネント: トースト表示メッセージ プロンプト ボックスの解釈と分析の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。