jd-opensource / jd-opensource/taro-ui

按钮对象在提交表单时报错

Open
#1,169 7 comments 3 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
4.7k
Forks
740
PR merge metrics
No merged PRs in 30d

Description

**问题描述**
AtButton 在提交表单或重置表单时报错。

**复现步骤**
创建一个仅包含一个输入框的Form表单
const Login: React.FC<{}> = (props) => {
const [state, setstate] = useState('tempdata');
const onChange = (v) => {
setstate(v);
}
const submitForm = (event: CommonEvent) => {
console.log(state)
}

const resetForm = () => {
}
return

提交
重置

}
export default Login;
可以正常编译,但是在打开小程序点击按钮时无响应,查看控制台有报错,具体信息见下。
以上例子如果换为标准的button按钮一切正常。

**期望行为**
可以正常打印表单信息

**报错信息**

Cannot read property 'triggerEvent' of undefined; [Component] Event Handler Error @ pages/login/index#bound eventHandler
TypeError: Cannot read property 'triggerEvent' of undefined
at AtButton.onReset (http://127.0.0.1:39160/appservice/vendors.js:5135:27)
at TaroElement.dispatchEvent (http://127.0.0.1:39160/appservice/taro.js:4648:35)
at H.eventHandler [as eh] (http://127.0.0.1:39160/appservice/taro.js:3029:16)

**系统信息**

**补充信息**
看了源码后,感觉以下代码存在bug
https://github.com/NervJS/taro-ui/blob/dev/src/components/button/index.tsx
在运行时$scope为未定义
private onSumit(event: CommonEvent): void {
if (this.state.isWEAPP || this.state.isWEB) {
this.$scope.triggerEvent('submit', event.detail, {
bubbles: true,
composed: true
})
}
}

private onReset(event: CommonEvent): void {
if (this.state.isWEAPP || this.state.isWEB) {
this.$scope.triggerEvent('reset', event.detail, {
bubbles: true,
composed: true
})
}
}

Contributor guide

Open the contributing guide

Research direction

Start in src/components/button/index.tsx and inspect the onSumit and onReset handlers, then reproduce the issue with the AtForm, AtInput, and AtButton example from the report. Done means submit and reset buttons work without the triggerEvent error and the form submit callback can print its data.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
frontend
Issue type
Bug
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
55/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.