input 输入框 监听@input

监控 input 输入框 @input 获取输入数据报错：Cannot read property ‘detail’ of undefined at VueComponent

使用 input 输入框,通过 @input 事件,监听输入框输入的内容变化
uniapp 文档中
@input EventHandle 当键盘输入时，触发input事件，event.detail = {value}

---

问题描述

在监听输入框数据变化的时候报错

<input  @input="GD_input()" v-model:value="GDval" />

GD_input(event) {
	console.log(event) // undefined
	this.GDval = event.detail.value
	// this.GDval = event.target.value  用 target 也是可以的
},

报错

[system]TypeError: Cannot read property 'detail' of undefined at VueComponent.GD_input (webpack-internal:///IGl5:87:26)

原因分析：

测试在方法内输出 参数 event 得到 undefined
对照官方示例,发现在 html 中 @input=“GD_input()” 这里调用 GD_input() 是没有括号的,将括号去掉,发现可以了

---

解决方案：

<!--这里GD_input的括号去掉,就可以了-->
<input  @input="GD_input" v-model:value="GDval" />

GD_input(event) {
	console.log(event) 
	this.GDval = event.detail.value
	// this.GDval = event.target.value  用 target 也是可以的
},