uni-app:showModal中实现弹窗中文本框输入

效果

代码

html 复制代码
<template>
  <view>
    <!-- 显示弹窗的按钮 -->
    <button @click="showInputDialog">显示弹窗</button>
  </view>
</template>

<script>
export default {
  methods: {
    showInputDialog() {
      uni.showModal({
        title: '请完成数据填写',
        content: '',
        editable:true,//是否显示输入框
		placeholderText:'请输入SN号',//输入框提示内容
        confirmText: '确认',
        cancelText: '取消',
        success: (res) => {
          if (res.confirm) {
            console.log('输入的内容:', res.content);
          }
        } 
      });
    }
  }
};
</script>

官方文档

uni.showToast(OBJECT) | uni-app官网 (dcloud.net.cn)

相关推荐
多多*30 分钟前
Spring之Bean的初始化 Bean的生命周期 全站式解析
java·开发语言·前端·数据库·后端·spring·servlet
linweidong35 分钟前
在企业级应用中,你如何构建一个全面的前端测试策略,包括单元测试、集成测试、端到端测试
前端·selenium·单元测试·集成测试·前端面试·mocha·前端面经
满怀10151 小时前
【HTML 全栈进阶】从语义化到现代 Web 开发实战
前端·html
繁依Fanyi1 小时前
用 UniApp 构建习惯打卡 App —— HabitLoop 开发记
javascript·uni-app·codebuddy首席试玩官
东锋1.31 小时前
前端动画库 Anime.js 的V4 版本,兼容 Vue、React
前端·javascript·vue.js
三天不学习1 小时前
Uniapp 与 Uniapp X 对比:新手上手指南及迁移到 Uniapp X 的注意事项
uni-app·uniapp x
满怀10151 小时前
【Flask全栈开发指南】从零构建企业级Web应用
前端·python·flask·后端开发·全栈开发
小杨升级打怪中2 小时前
前端面经-webpack篇--定义、配置、构建流程、 Loader、Tree Shaking、懒加载与预加载、代码分割、 Plugin 机制
前端·webpack·node.js
Yvonne爱编码2 小时前
CSS- 4.4 固定定位(fixed)& 咖啡售卖官网实例
前端·css·html·状态模式·hbuilder
SuperherRo2 小时前
Web开发-JavaEE应用&SpringBoot栈&SnakeYaml反序列化链&JAR&WAR&构建打包
前端·java-ee·jar·反序列化·war·snakeyaml