微信小程序实现文本输入弹窗

原创

已于 2025-01-10 13:02:59 修改 · 5k 阅读

36 ·

CC 4.0 BY-SA版权

文章标签：

#小程序

于 2021-01-19 21:36:44 首次发布

微信小程序实现文本输入弹窗

场景
实现
效果图

场景

用户进入界面弹出输入窗口，需要用户输入内容，如果取消则跳转到指定界面，重新进入还会弹出窗口，只有输入正确内容才能正式进入此界面

实现

wxml代码

<view class="container">
  <view wx:if="{
    
    {!completed}}">
    <view class='toast-box'>
      <view class='toastbg'></view>
      <view class='showToast'>
        <view class='toast-title'>
          <text>确认底金?</text>
        </view>
        <view class='toast-main'>
          <view class='toast-input'>
            <input type='number' placeholder='请输入符合您的保底金额~' focus