陈慕一
陈慕一
  • 发布:2024-07-09 09:28
  • 更新:2024-07-09 18:00
  • 阅读:48

uni-popup-dialog mode="input" 打开时如何修改input的值

分类:uni-app

如题,vue3下打开弹窗时,没法修改v-model绑定的值

2024-07-09 09:28 负责人:无 分享
已邀请:
爱豆豆

爱豆豆 - 办法总比困难多

uni-popup-dialog的源码中 input的值是在组件触发created时赋值的 也就导致了input只会赋值一次 后面无法通过动态修改 你看下uni-popup-dialog源码就明白了
可以动态控制uni-popup-dialog的显示和隐藏 来触发组件内的created方法 然后让你修改的值显示出来

<template>  
    <view class="">  
        <view>  
            <button type="primary" @click="showPopup"><text>输入对话框</text></button>  
            <uni-popup @change="popupChange" ref="inputDialog" type="dialog">  
                <uni-popup-dialog v-if="isShowDialog" mode="input" title="输入内容" v-model="text"   
                    placeholder="请输入内容"></uni-popup-dialog>  
            </uni-popup>  
        </view>  
    </view>  
</template>  

<script setup>  
    import { ref } from 'vue';  
    const inputDialog = ref()  
    const isShowDialog = ref(false)  
    const text = ref('111')  
    const showPopup = () => {  
        inputDialog.value.open()  
        text.value = '222'  
    }  
    const popupChange = (val) => {  
        isShowDialog.value = val.show  
    }  
</script>  
  • 陈慕一 (作者)

    解决咯 谢谢啦

    2024-07-11 08:17

爱豆豆

爱豆豆 - 办法总比困难多

可以修改啊 你怎么使用的 能提供下复现demo吗 帮你看看

  • 陈慕一 (作者)

    <uni-popup-dialog

    confirmText="保存"

    ref="inputClose"

    mode="input"

    title="添加项目"

    v-model="dialogInput"

    placeholder="请输入内容"

    @confirm="submitProject"

    ></uni-popup-dialog>,

    const edit = (e) => {

    dialogInput.value = e.name

    addPopup.value.open()

    }

    就是点击按钮,打开弹窗, 然后给弹窗中的input 赋值

    2024-07-09 16:58

  • 爱豆豆

    回复 陈慕一: 运行的那个端?

    2024-07-09 17:05

  • 陈慕一 (作者)

    回复 爱豆豆: 微信小程序

    2024-07-09 17:19

  • 爱豆豆

    回复 陈慕一: 看我最新回复 利用v-if可以解决这个问题

    2024-07-09 18:01

要回复问题请先登录注册