uni-app nvue textarea 设置confirm-type为send时点击发送触发不了@confirm事件

uni-app nvue textarea 设置confirm-type为send时点击发送触发不了@confirm事件

开发环境 版本号 项目创建方式
Mac 12.1 HBuilderX 
产品分类：uniapp/App

PC开发环境操作系统：Mac

PC开发环境操作系统版本号：12.1

HBuilderX类型：正式

HBuilderX版本号：3.4.7

手机系统：iOS

手机系统版本号：iOS 15

手机厂商：苹果

手机机型：13mini

页面类型：nvue

vue版本：vue2

打包方式：云端

示例代码：

<textarea
placeholder=""
:show-confirm-bar=“false”
:cursor-spacing=“20”
:auto-focus=“false”
:auto-height=“true”
:adjust-position=“true”
v-model=“Input”
maxlength=“150”
confirm-type=“send”
@focus=“scrollBottom”
@confirm=“sendMsg”

</textarea> 

操作步骤：
- 直接就能复线

预期结果：
- 执行[@confirm](/user/confirm)事件

实际结果：
- 没反应

bug描述：
- nvue textarea 设置confirm-type为send时点击发送触发不了[@confirm](/user/confirm)事件

更多关于uni-app nvue textarea 设置confirm-type为send时点击发送触发不了@confirm事件的实战教程也可以访问 https://www.itying.com/category-93-b0.html

2 回复

注意平台差异说明，详见文档

更多关于uni-app nvue textarea 设置confirm-type为send时点击发送触发不了@confirm事件的实战教程也可以访问 https://www.itying.com/category-93-b0.html


在 uni-app 的 nvue 中，textarea 组件支持 confirm-type 属性，用于设置键盘右下角的按钮类型。当 confirm-type 设置为 send 时，键盘右下角的按钮会显示为“发送”。然而，[@confirm](/user/confirm) 事件在某些情况下可能无法正常触发，尤其是在 nvue 中。

解决方案

  1. 检查 [@confirm](/user/confirm) 事件绑定： 确保你已经正确绑定了 [@confirm](/user/confirm) 事件。例如：

    <textarea confirm-type="send" [@confirm](/user/confirm)="handleConfirm"></textarea>

  2. 使用 [@input](/user/input) 或 [@blur](/user/blur) 事件： 如果 [@confirm](/user/confirm) 事件无法触发，可以尝试使用 [@input](/user/input) 或 [@blur](/user/blur) 事件来监听用户输入或失去焦点的操作。

    <textarea confirm-type="send" [@input](/user/input)="handleInput" [@blur](/user/blur)="handleBlur"></textarea>

  3. 手动监听键盘事件： 你可以通过监听键盘的“完成”或“发送”按钮来手动触发事件。例如：

    methods: {
  handleInput(event) {
    if (event.detail.value && event.detail.confirm) {
      this.handleConfirm(event);
    }
  },
  handleConfirm(event) {
    console.log('发送内容:', event.detail.value);
    // 处理发送逻辑
  }
}

  4. 检查 nvue 版本和兼容性： 确保你使用的 uni-app 和 nvue 版本是最新的，因为某些问题可能已经在后续版本中修复。

  5. 使用 input 组件替代： 如果 textarea 的 [@confirm](/user/confirm) 事件仍然无法触发，可以尝试使用 input 组件，并设置 confirm-type 为 send，然后监听 [@confirm](/user/confirm) 事件。

    <input confirm-type="send" [@confirm](/user/confirm)="handleConfirm" />

示例代码

<template>
  <view>
    <textarea confirm-type="send" [@confirm](/user/confirm)="handleConfirm" [@input](/user/input)="handleInput"></textarea>
  </view>
</template>

<script>
export default {
  methods: {
    handleConfirm(event) {
      console.log('发送内容:', event.detail.value);
      // 处理发送逻辑
    },
    handleInput(event) {
      if (event.detail.value && event.detail.confirm) {
        this.handleConfirm(event);
      }
    }
  }
}
</script>
回到顶部