Form 做动作前都会 flush 一把

This commit is contained in:
2betop 2019-12-25 17:30:35 +08:00
parent 7f454b6c34
commit 052c1f55f6
4 changed files with 27 additions and 24 deletions

View File

@ -72,7 +72,8 @@
"sortablejs": "1.10.0", "sortablejs": "1.10.0",
"tslib": "^1.10.0", "tslib": "^1.10.0",
"uncontrollable": "4.1.0", "uncontrollable": "4.1.0",
"video-react": "0.9.4" "video-react": "0.9.4",
"lodash": "^4.17.15"
}, },
"devDependencies": { "devDependencies": {
"@types/dom-helpers": "^3.4.1", "@types/dom-helpers": "^3.4.1",

View File

@ -303,13 +303,11 @@ export default class ComboControl extends React.Component<ComboProps> {
handleChange(values: any, diff: any, {index}: any) { handleChange(values: any, diff: any, {index}: any) {
const { const {
formItem,
flat, flat,
store, store,
joinValues, joinValues,
delimiter, delimiter,
disabled, disabled,
validateOnChange,
submitOnChange submitOnChange
} = this.props; } = this.props;
@ -326,10 +324,6 @@ export default class ComboControl extends React.Component<ComboProps> {
this.props.onChange(value, submitOnChange, true); this.props.onChange(value, submitOnChange, true);
if (validateOnChange !== false && formItem && formItem.validated) {
this.subForms.forEach(item => item.validate());
}
store.forms.forEach(item => store.forms.forEach(item =>
item.items.forEach(item => item.unique && item.syncOptions()) item.items.forEach(item => item.unique && item.syncOptions())
); );

View File

@ -46,6 +46,7 @@ export default class FormControl extends React.PureComponent<
> { > {
public model: IFormItemStore | undefined; public model: IFormItemStore | undefined;
control: any; control: any;
value?: any;
hook?: () => any; hook?: () => any;
hook2?: () => any; hook2?: () => any;
hook3?: () => any; hook3?: () => any;
@ -61,7 +62,7 @@ export default class FormControl extends React.PureComponent<
trailing: true, trailing: true,
leading: false leading: false
}); });
state = {value: this.props.control.value}; state = {value: this.value = this.props.control.value};
componentWillMount() { componentWillMount() {
const { const {
formStore: form, formStore: form,
@ -122,11 +123,11 @@ export default class FormControl extends React.PureComponent<
// 同步 value // 同步 value
this.setState({ this.setState({
value: model.value value: this.value = model.value
}); });
this.reaction = reaction( this.reaction = reaction(
() => model.value, () => model.value,
value => this.setState({value}) value => this.setState({value: this.value = value})
); );
} }
@ -371,28 +372,25 @@ export default class FormControl extends React.PureComponent<
value = pipeOut(value, oldValue, form.data); value = pipeOut(value, oldValue, form.data);
} }
this.setState( this.setState({
{ value: this.value = value
value });
}, changeImmediately || conrolChangeImmediately || !formInited
() => ? this.emitChange(submitOnChange)
changeImmediately || conrolChangeImmediately || !formInited : this.lazyEmitChange(submitOnChange);
? this.emitChange(submitOnChange)
: this.lazyEmitChange(submitOnChange)
);
} }
emitChange(submitOnChange: boolean = this.props.control.submitOnChange) { emitChange(submitOnChange: boolean = this.props.control.submitOnChange) {
const { const {
formStore: form, formStore: form,
onChange, onChange,
control: {validateOnChange, name, pipeOut, onChange: onFormItemChange} control: {validateOnChange, name, onChange: onFormItemChange}
} = this.props; } = this.props;
if (!this.model) { if (!this.model) {
return; return;
} }
let value = this.state.value; const value = this.value; // value 跟 this.state.value 更及时。
const oldValue = this.model.value; const oldValue = this.model.value;
if (oldValue === value) { if (oldValue === value) {
@ -445,8 +443,9 @@ export default class FormControl extends React.PureComponent<
return; return;
} }
let lastKey: string = '', let lastKey: string = '';
lastValue: any; let lastValue: any;
Object.keys(values).forEach(key => { Object.keys(values).forEach(key => {
const value = values[key]; const value = values[key];
lastKey = key; lastKey = key;

View File

@ -538,10 +538,18 @@ export default class Form extends React.Component<FormProps, object> {
trimValues trimValues
} = this.props; } = this.props;
// 做动作之前,先把数据同步一下。
this.flush();
if (trimValues) { if (trimValues) {
store.trimValues(); store.trimValues();
} }
// 如果 data 就是当前层,则 flush 一下。
if (data === this.props.data) {
data = store.data;
}
if (Array.isArray(action.required) && action.required.length) { if (Array.isArray(action.required) && action.required.length) {
return store.validateFields(action.required).then(result => { return store.validateFields(action.required).then(result => {
if (!result) { if (!result) {
@ -925,7 +933,8 @@ export default class Form extends React.Component<FormProps, object> {
disabled: disabled || (control as Schema).disabled || form.loading, disabled: disabled || (control as Schema).disabled || form.loading,
btnDisabled: form.loading || form.validating, btnDisabled: form.loading || form.validating,
onAction: this.handleAction, onAction: this.handleAction,
onChange: formLazyChange === false ? this.handleChange : this.lazyHandleChange, onChange:
formLazyChange === false ? this.handleChange : this.lazyHandleChange,
addHook: this.addHook, addHook: this.addHook,
removeHook: this.removeHook, removeHook: this.removeHook,
renderFormItems: this.renderFormItems, renderFormItems: this.renderFormItems,