碧霜寒冰
碧霜寒冰
  • 发布:2019-05-22 15:27
  • 更新:2021-10-27 11:41
  • 阅读:3015

【报Bug】UniApp input封装为组件之后input事件会跨组件触发

分类:uni-app

详细问题描述

(DCloud产品不会有明显的bug,所以你遇到的问题大都是在特定环境下才能重现的问题,请仔细描述你的环境和重现方式,否则DCloud很难排查解决你的问题)

[内容]
uniApp自定义编译模式,input封装为组件后,微信小程序真机,input获取焦点后点击页面其他元素,@input事件会在父页面触发,然后报错

重现步骤

[步骤] input获取焦点,点击页面其他元素

[结果]子组件中定义的@input事件会在父页面触发报找不到方法

[期望]修复此bug

[如果语言难以表述清晰,拍一个视频或截图,有图有真相]

IDE运行环境说明

[HBuilder 或 HBuilderX。如果你用其他工具开发uni-app,也需要在此说明]HBuilder1.9.8
[windows版本号]win7

uni-app运行环境说明

[运行端是h5或app或某个小程序?]微信小程序

[运行端版本号]微信版本7.0.4 基础库2.7.0

[项目是cli创建的还是HBuilderX创建的?如果是cli创建的,请更新到最新版cli再试]HBuilder1.9.8

[编译模式是老模板模式还是新的自定义组件模式?]自定义组件模式

App运行环境说明

[Android版本号]安卓9.0

[手机型号]小米6

附件

[代码片段]
子组件

<template>  
    <view>  
        <input style="width:100%;border:1px solid #ddd;border-radius:15upx;" @input="inputChange" />  
    </view>  
</template>  
<script>  
    export default {  
        data() {  
            return {  
            };  
        },  
        methods:{  
            inputChange(e) {  
                console.log(e);  
            }  
        }  
    }  
</script>

父页面

<template>  
    <view class="content">  
        <image class="logo" src="/static/logo.png"></image>  
        <view>  
            <test-input></test-input>  
            <text class="title">{{title}}</text>  
        </view>  
    </view>  
</template>  
<script>  
    import testInput from "@/components/TestInput.vue";  
    export default {  
        components:{  
            testInput  
        },  
        data() {  
            return {  
                title: 'Hello'  
            }  
        },  
    }  
</script>
2019-05-22 15:27 负责人:无 分享
已邀请:
碧霜寒冰

碧霜寒冰 (作者)

官方是没人看bug吗

碧霜寒冰

碧霜寒冰 (作者)

官方的人呢@DCloud_UNI_CHB @DCloud_UNI_FXY @DCloud_UNI_GSQ @DCloud_UNI_HT @DCloud_UNI_HDX @DCloud_UNI_ZGH

the_wolf_life

the_wolf_life - 大前端领航者

这个问题我也遇到过 安卓真机测试时出现的 最后就没用组件

ZGH0709

ZGH0709

Bug 已确认,后续我们会修复此问题。

  • GCJ

    这个bug还是存在哦? 现在封装了input为自定义组件以后,输入以后, 点击input以外的区域,失去焦点, 就会报 _vm.onInput is not a function 的错误

    2020-04-09 12:12

  • GCJ

    编译为微信小程序。

    2020-04-09 12:13

  • dddafa2

    求修复

    2020-09-21 14:14

  • lihailan

    为啥这么久的问题到现在 还没有解决

    2021-01-27 17:14

  • a***@sina.cn

    想问一下为啥还存在这种情况?这办事效率有点低呀

    2021-03-03 17:30

s***@99xs.com

s***@99xs.com

这个bug现在还存在,官方有人在修复吗?

n***@163.com

n***@163.com

有计划修复吗?现在还是有问题。

n***@163.com

n***@163.com

经过楼主的启发,我在父页面中定义了子组件中监听的方法inputChange,在这个方法中再调用子组件中的inputChange方法,这样不会报异常,并且在父页面也能拿到这个input的值了

不想你丶

不想你丶 - 90IT男

BUG依然存在,在微信小程序输入法是英文联想状态需要选词的情况下,输入框有值,但是没有确定词的情况下,失去焦点;输入框看着是有值,但是获取不到值,并且报上面的错误

GCJ

GCJ

微信小程序下(未测试编译为其他模式),此BUG依然存在。。。。 为什么这么明显的bug没有人修复。。。

复读机

复读机

依然报错 求修复

油油

油油

想知道解决了吗。我也出现了同样的问题。

5***@qq.com

5***@qq.com

依旧如此

麦克雷

麦克雷 - 肥比

2021年了依然如此

3***@qq.com

3***@qq.com - 咸鱼飞

这么重大的bug啊,等了一年还是没人解决。!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
这里给大家一个处理办法,blur的时候可以捕捉到值,然后重新赋值。但是如果组件里面有10个input,那么你就得处理10个blur回调。【我裂开了】

a***@sina.cn

a***@sina.cn

2021年3月了依然如此

叫西红柿炒番茄

叫西红柿炒番茄

2021年10月bug依旧在

该问题目前已经被锁定, 无法添加新回复