[已删除]
[已删除]
  • 发布:2020-04-24 12:00
  • 更新:2022-08-25 14:00
  • 阅读:6032

uniapp input内容点击发送按钮后怎么才能让键盘不收起?

分类:uni-app

uniapp input内容点击发送按钮后怎么才能让键盘不收起?

2020-04-24 12:00 负责人:无 分享
已邀请:
喜欢技术的前端

喜欢技术的前端 - QQ---445849201

这个问题可以这样处理
如需禁止点击其他位置收起键盘的默认行为,可以监听touch事件并使用prevent修饰符(仅支持App-v3、H5,其他平台可以通过设置focus来使输入框重新获取焦点),例如在确认按钮上使用:@touchend.prevent="onTap"

1***@qq.com

1***@qq.com

微信小程序可以这个 hold-keyboard="true"

x***@qq.com

x***@qq.com - 疑问?的小纳?

应该不能

[已删除]

[已删除] (作者)

我解决了。
说说我的情况,我写了一个聊天app,聊天界面底部一个输入框,一个发送按钮。每次点击发送键盘都会收起,如何还要发生就要重新点击输入框调起键盘。无法想微信那样保持输入框常驻。
我的解决办法是:
<view class="chat-ipt">
<input id="msg-text" type="text" cursor-spacing="10" :focus="is_focus" v-model="info" value="" />
<view class="fs_btn">
<input type="text" @blur="chat_blur" @focus="chat_focus" cursor-spacing="10" value="" />
<button>发送</button>
</view>
</view>

在输入区有两个input,第一个放输入的内容,第二个和按钮放在一起用view包裹起来。
在第一个按钮上监听focus属性,默认时false。
在第二个输入框上监听获得、失去两个焦点。在获得焦点的时候,将is_focus设置为true,这会让第一个input得到焦点,同时处理信息发送的逻辑。在失去焦点时将is_focus设置为false。
第二个input使用定位放在按钮上面,设置透明度为0.
chat_blur(){
this.is_focus = false;
},
chat_focus(){
this.is_focus = true;
this.fs_info();//发送逻辑
}
这样就实现了键盘常驻了。

  • 5***@qq.com

    亲能发个全一点的吗,我照着你的方式,还是会闪

    2020-09-22 17:10

  • 1***@qq.com

    你这样不会出现闪动吗?

    2023-03-27 08:40

z***@qq.com

z***@qq.com

但是在这种办法键盘会闪一下啊 有没有更好的解决办法

[已删除]

[已删除] (作者)

不会闪,实际上只是两个输入框的焦点切换。键盘不会收起。
官方有给出新的解决方案:
<input type="text" cursor-spacing="7.5" v-model="info" value="" />
<button @touchend.prevent="fs_info">发送</button>

在发送按钮上@touchend.prevent就可以了,不需要其他处理。

  • z***@qq.com

    所以发送按钮是是个input还是button

    2020-05-11 14:02

  • z***@qq.com

    @touchend.prevent=""括号里面是什么内容啊

    2020-05-11 14:07

  • [已删除] (作者)

    回复 z***@qq.com: @touchend.prevent="" 绑定的事件。

    touchend是手机触摸到屏幕离开

    prevent是touchend的修饰符,阻止默认行为。

    2020-05-11 14:23

  • z***@qq.com

    回复 [已删除]: 我试了下 不太行啊

    2020-05-11 14:53

  • z***@qq.com

    回复 [已删除]: 我的发送是一个view 碍事吗

    2020-05-11 14:54

  • [已删除] (作者)

    回复 z***@qq.com: 不碍事。具体可以看这里 : https://uniapp.dcloud.io/component/input?id=%e5%85%b3%e4%ba%8e%e8%bd%af%e9%94%ae%e7%9b%98%e5%bc%b9%e5%87%ba%e7%9a%84%e9%80%bb%e8%be%91%e8%af%b4%e6%98%8e

    2020-05-11 14:59

  • z***@qq.com

    回复 [已删除]: 发送事件使用tap还是click

    2020-05-11 15:03

  • [已删除] (作者)

    回复 z***@qq.com: touchend 这个就是事件了啊

    @touchend.prevent="你的逻辑函数"

    2020-05-11 15:36

  • StarSky

    回复 z***@qq.com: 有可能你使用了uni.hideKeyboard()方法影响到了发送按钮上的@touchend.prevent=

    2020-06-28 11:20

  • 1***@qq.com

    键盘的发送没有办法做

    2023-03-07 16:20

以何为家

以何为家 - 这个人很烂,暂无介绍

@touchend.prevent 不支持微信小程序,在微信小程序上输入完了发送后键盘会收回来。

以何为家

以何为家 - 这个人很烂,暂无介绍

两个输入框焦点切换的方法app不会闪,微信小程序会闪,现在微信小程序不知道有没有什么方法让键盘常驻呢?

  • v***@qq.com

    你好,我和你一样遇到相同的情况,微信小程序无法解决,难道要用原生吗?谢谢

    2022-03-30 22:21

  • 1***@qq.com

    如果是键盘的发送也会闪一下

    2023-03-07 16:20

要回复问题请先登录注册