Heim > WeChat-Applet > Mini-Programmentwicklung > Teilen von Implementierungsbeispielen für benutzerdefinierte Nachrichtenaufforderungsfelder in WeChat-Miniprogrammen

Teilen von Implementierungsbeispielen für benutzerdefinierte Nachrichtenaufforderungsfelder in WeChat-Miniprogrammen

黄舟
Freigeben: 2017-09-12 11:30:41
Original
2773 Leute haben es durchsucht

In diesem Artikel werden hauptsächlich die relevanten Informationen zum benutzerdefinierten Nachrichtenaufforderungsfeld des WeChat-Applets und zum Schnittstellenaufruf wx.showToast (OBJECT) zur Implementierung der geänderten Funktion vorgestellt. Bedürftige Freunde können sich auf

WeChat Mini beziehen Eingabeaufforderungsfeld für benutzerdefinierte Nachrichten des Programms

Anforderungsbeschreibung:

wx.showToast(OBJECT)-Schnittstellenaufruf, aber Symbol und Bild sind nicht erforderlich Wenn das Bild leer ist, gibt es einen Platzhalter. Tatsächlich möchte es nur benutzerdefinierten Textinhalt ausgeben.

Screenshot des Effekts:

Der Code lautet wie folgt:


<!--index.wxml-->
<!-- 页面正文 -->
<view>
 <block wx:for="{{50}}">
  <view> 123456 123456 123456 123456 123456</view>
 </block>
</view>
<!-- 自定义弹窗 -->
<view class="showModule" wx:if="{{isShow}}">
 <!-- 这部分内容可以灵活修改,例如改成一个模态框 -->
 <view class="text ">{{text}}</view>
</view>
Nach dem Login kopieren


/* index.wxss */

.showModule {
 /* 用样式控制隐藏 visibility: hidden;*//* flex 布局 */
 display: flex;
 justify-content: center;
 align-items: center;
 /* 生成绝对定位的元素,相对于浏览器窗口进行定位 */
 position: fixed;
 /* 如果 height,width 不变的情况下,left,top 不用修改 */
 left: 35%;
 top: 40%;
 height: 20vh;
 width: 30vw;
 /* 不透明 */
 opacity: 0.99;
 background-color: #7b7b7b;
 /* 圆角 */
 border-radius: 30rpx;
}

.showModule .text {
 /* flex 布局 */
 display: flex;
 /* 字体加粗 */
 font-weight: bold;
 color: white;
 font-size: 13pt;
 font-family: "微软雅黑";
 /* Helvetica,
   Arial,
   Hiragino Sans GB,
   Source Han Sans CN,
   PingFang SC,
   Roboto,
   微软雅黑,
   Heiti SC,
   Microsoft Yahei,
   sans-serif; */
}
Nach dem Login kopieren


//index.js
//获取应用实例
var app = getApp()
Page({
 data: {
  text: "弹窗内容",
  isShow: false
 },
 onShow() {
  this.setData({
   text: "用户取消支付",
   isShow: true
  })
 }
})
Nach dem Login kopieren

Das obige ist der detaillierte Inhalt vonTeilen von Implementierungsbeispielen für benutzerdefinierte Nachrichtenaufforderungsfelder in WeChat-Miniprogrammen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage