错误指向getValidationState()和complete(),但我还没有找到源代码。我正在尝试进行一个输入,其验证状态会根据用户指定的输入长度而变化。
import React, { Component } from 'react';
import 'bootstrap/dist/css/bootstrap.css';
import 'bootstrap/dist/css/bootstrap-theme.css';
import { FormGroup, ControlLabel, FormControl, HelpBlock } from 'react-bootstrap';
class FormGroupValidation extends Component {
constructor(props) {
super(props);
this.state = {
value: '',
completed: false
};
this.getValidationState = this.getValidationState.bind(this);
this.complete = this.getValidationState.bind(this);
this.unComplete = this.unComplete.bind(this);
this.toggleComplete = this.toggleComplete.bind(this);
this.handleChange = this.handleChange.bind(this);
}
getValidationState() {
const length = this.state.value.length;
if (this.ThresholdType === 'max') {
if (this.props.errorLen && length <= this.props.errorLen) {
return 'error';
} else if (this.props.warnLen && length <= this.props.warnLen) {
this.unComplete();
return 'warning';
} else if (this.props.successLen && length <= this.props.successLen) {
this.complete();
return 'success';
}
} else {
if (this.props.successLen && length >= this.props.successLen) {
this.complete();
return 'success';
} else if (this.props.warnLen && length >= this.props.warnLen) {
return 'warning';
} else if (this.props.errorLen && length >= this.props.errorLen) {
this.unComplete();
return 'error';
}
}
}
complete() {
if (!this.state.complete) this.toggleComplete();
}
unComplete() {
if (this.state.complete) this.toggleComplete();
}
toggleComplete() {
this.setState({completed: !this.state.completed});
}
handleChange(e) {
this.setState({ value: e.target.value });
}
render() {
return (
<form>
<FormGroup
controlId="formBasicText"
validationState={this.getValidationState()}
>
<ControlLabel>Working example with validation</ControlLabel>
<FormControl
type="text"
value={this.state.value}
placeholder="Enter text"
onChange={this.handleChange}
/>
<FormControl.Feedback />
<HelpBlock>Validation is based on string length. </HelpBlock>
</FormGroup>
</form>
);
}
}
export default FormGroupValidation;
答案 0 :(得分:2)
this.complete = this.getValidationState.bind(this);
应该是
this.complete = this.complete.bind(this);
)