m***@qq.com
m***@qq.com
  • 发布:2019-01-30 21:32
  • 更新:2021-07-01 18:42
  • 阅读:3070

uni-textarea自动获取焦点,键盘弹出瞬间又自动隐藏了,有没有大神有解决方法

分类:uni-app

<textarea class="content" :focus="true" :fixed="true" maxlength="250" placeholder="请输入内容..." v-model="content"/>

2019-01-30 21:32 负责人:无 分享
已邀请:
uniapp_wujw

uniapp_wujw -

解决了吗??我使用延迟好像不可以

  • 拾柒

    我的也不行,你解决了吗

    2020-06-13 13:19

拾柒

拾柒

同样的问题,求解决方案

回梦無痕

回梦無痕 - qq565766672,论坛私信不回,有需要请加QQ,付费咨询指导。

看图片,怀疑是按钮的click事件导致的,干掉click事件试一下。

m***@qq.com

m***@qq.com (作者) - IT

不是click事件引起的,删了也没用,怀疑是CSS写的fix布局的问题css载入晚于键盘弹出,所以自动缩到底部,把键盘压回去了,不知道怎么解决。。。

  • 回梦無痕

    上一个简单的demo咯。

    2019-01-31 12:38

m***@qq.com

m***@qq.com (作者) - IT

<template>
<view>
<view class="example">
<button type="primary" @click="change">提交</button>
</view>
<view class="box" v-if="show">
<view class="uni-flex uni-column">
<view class="uni-flex header">
<text style="width: 80px;" @click="btnClick('0')">取消</text>
<text style="flex: 1;"></text>
<text style="width: 80px;" @click="btnClick('1')">确认</text>
</view>
<view class="uni-textarea">
<textarea class="content" :focus="true" :fixed="true" maxlength="250" placeholder="请输入内容..." v-model="content"/>
</view>
</view>
</view>
</view>
</template>

<script>
export default {
components: {

    },  
    data() {  
        return {  
            show: false,  
            content: ''  
        }  
    },  
    methods:{  
        change(){  
            this.show = true;  
        },  
        btnClick: function(type) {  
            switch (Number(type)){  
                case 0:  
                    uni.showToast({ title: "点击了取消按钮", icon: "none" });  
                    break;  
                case 1:  
                    uni.showToast({ title: "点击了确定按钮", icon: "none" });  
                    break;  
                default:  
                    break;  
            }  
            this.show = false;  
        },  
    }  
}  

</script>

<style>
button{
margin: 30upx;
}
.box {
position: fixed;
width: 100%;
height: 160px;
min-height: 160px;
left: 0upx;
bottom: 0upx;
overflow: hidden;
z-index: 1000;
background-color: #FFFFFF;
}
.box .header {
height: 40px;
text-align: center;
align-items: center;
border-bottom: #E7E7E7 1px solid;
}
.box .content {
height: 100px;
background-color: #F7F7F7;
box-sizing: border-box;
}
.box .uni-textarea {
box-sizing: border-box;
padding-left: 30upx;
margin: 10upx 0;
}
</style>

5***@qq.com

5***@qq.com

请问问题解决了吗 我也遇到同样的问题

d***@163.com

d***@163.com

同问

2***@qq.com

2***@qq.com

我好像也遇到类似问题了

qweqwe1231231

qweqwe1231231

请问问题解决了嘛

要回复问题请先登录注册