optimize form submit logic

yhy
Dawn_Ocean 2024-03-07 01:40:11 +08:00
parent 21e21f272f
commit f37af7dacd
2 changed files with 30 additions and 2 deletions

View File

@ -1,12 +1,14 @@
import { Component, ReactNode } from 'react'; import { Component, ReactNode } from 'react';
import { AtForm, AtInput, AtButton } from 'taro-ui'; import { AtForm, AtInput, AtButton, AtMessage } from 'taro-ui';
import './inform.scss'; import './inform.scss';
import Taro from '@tarojs/taro';
export default class InformPage extends Component { export default class InformPage extends Component {
state = { state = {
phone: '', phone: '',
name: '', name: '',
isLoading: false, isLoading: false,
isDisable: false,
}; };
handleChangePhone(phone: string) { handleChangePhone(phone: string) {
this.setState({ this.setState({
@ -23,11 +25,21 @@ export default class InformPage extends Component {
onSubmit() { onSubmit() {
this.setState({ this.setState({
isLoading: true, isLoading: true,
isDisable: true,
}); });
console.log(this.state.name, this.state.phone); console.log(this.state.name, this.state.phone);
this.setState({ this.setState({
isLoading: false, isLoading: false,
}); });
Taro.atMessage({
message: '提交成功',
type: 'success',
});
setTimeout(() => {
this.setState({
isDisable: false,
});
}, 1000);
} }
onReset() { onReset() {
this.setState({ this.setState({
@ -42,6 +54,7 @@ export default class InformPage extends Component {
onSubmit={this.onSubmit.bind(this)} onSubmit={this.onSubmit.bind(this)}
onReset={this.onReset.bind(this)} onReset={this.onReset.bind(this)}
> >
<AtMessage />
<AtInput <AtInput
name='phone' name='phone'
title='手机号码' title='手机号码'
@ -63,6 +76,7 @@ export default class InformPage extends Component {
loading={this.state.isLoading} loading={this.state.isLoading}
formType='submit' formType='submit'
type='primary' type='primary'
disabled={this.state.isDisable}
> >
</AtButton> </AtButton>

View File

@ -1,11 +1,13 @@
import { AtTextarea, AtButton, AtForm } from 'taro-ui'; import { AtTextarea, AtButton, AtForm, AtMessage } from 'taro-ui';
import { Component, ReactNode } from 'react'; import { Component, ReactNode } from 'react';
import './report.scss'; import './report.scss';
import Taro from '@tarojs/taro';
export default class SettingsPage extends Component { export default class SettingsPage extends Component {
state = { state = {
report: '', report: '',
isLoading: false, isLoading: false,
isDisable: false,
}; };
handleChange(report: string) { handleChange(report: string) {
this.setState({ this.setState({
@ -15,11 +17,21 @@ export default class SettingsPage extends Component {
onSubmit() { onSubmit() {
this.setState({ this.setState({
isLoading: true, isLoading: true,
isDisable: true,
}); });
console.log(this.state.report); console.log(this.state.report);
this.setState({ this.setState({
isLoading: false, isLoading: false,
}); });
Taro.atMessage({
message: '提交成功',
type: 'success',
});
setTimeout(() => {
this.setState({
isDisable: false,
});
}, 1000);
} }
onReset() { onReset() {
this.setState({ this.setState({
@ -32,6 +44,7 @@ export default class SettingsPage extends Component {
onSubmit={this.onSubmit.bind(this)} onSubmit={this.onSubmit.bind(this)}
onReset={this.onReset.bind(this)} onReset={this.onReset.bind(this)}
> >
<AtMessage />
<AtTextarea <AtTextarea
value={this.state.report} value={this.state.report}
onChange={this.handleChange.bind(this)} onChange={this.handleChange.bind(this)}
@ -42,6 +55,7 @@ export default class SettingsPage extends Component {
loading={this.state.isLoading} loading={this.state.isLoading}
formType='submit' formType='submit'
type='primary' type='primary'
disabled={this.state.isDisable}
> >
</AtButton> </AtButton>