Skip to content

Commit 58f5ec3

Browse files
committed
v1.5.0
1. FormItem新增showRequiredMark属性 2. 细节调整
1 parent 04399e9 commit 58f5ec3

20 files changed

+111
-46
lines changed

README.md

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -91,6 +91,7 @@ labelPosition?: "top" | "left";
9191
labelAlign?: "left" | "right";
9292
controlStyle?: React.CSSProperties;
9393
controlClassName?: string;
94+
showRequiredMark?: boolean;
9495
required?: boolean;
9596
requiredMessage?: string;
9697
clearErrorOnFocus?: boolean;
@@ -275,6 +276,10 @@ $form-item-cls: nex-form-item;
275276
flex: none;
276277
}
277278

279+
&-label-left {
280+
text-align: left;
281+
}
282+
278283
&-top {
279284
display: block;
280285
}
@@ -303,6 +308,7 @@ $form-item-cls: nex-form-item;
303308
}
304309
}
305310

311+
306312
```
307313

308314

docs/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
<!doctype html><html style="width:100%;height:100%;overflow:auto"><head><meta charset="utf-8"><title>Layout</title><meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1"><style>.demo{width:1100px;height:500px;margin:50px auto;background:#fff;font-size:12px;overflow:auto}.rw-layout-content{height:200px}.rw-layout.rw-layout-has-sider{text-align:center;background:#3ba0e9}.rw-layout-sider{width:200px;text-align:center;background:#3ba0e9;color:#fff}.rw-layout-footer,.rw-layout-header{background:#7dbcea;color:#fff;height:64px;line-height:64px;text-align:center}.rw-layout-content{background:rgba(16,142,233,1);color:#fff;text-align:center}</style><link href="static/css/2.71a0092d.chunk.css" rel="stylesheet"><link href="static/css/index.b2e6f73b.chunk.css" rel="stylesheet"></head><body style="background:#f5f5f5"><div class="demo" id="demo"></div><script src="static/js/runtime~index.f795885b.js"></script><script src="static/js/2.71a0092d.chunk.js"></script><script src="static/js/index.b2e6f73b.chunk.js"></script></body></html>
1+
<!doctype html><html style="width:100%;height:100%;overflow:auto"><head><meta charset="utf-8"><title>Layout</title><meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1"><style>.demo{width:1100px;height:500px;margin:50px auto;background:#fff;font-size:12px;overflow:auto}.rw-layout-content{height:200px}.rw-layout.rw-layout-has-sider{text-align:center;background:#3ba0e9}.rw-layout-sider{width:200px;text-align:center;background:#3ba0e9;color:#fff}.rw-layout-footer,.rw-layout-header{background:#7dbcea;color:#fff;height:64px;line-height:64px;text-align:center}.rw-layout-content{background:rgba(16,142,233,1);color:#fff;text-align:center}</style><link href="static/css/2.71a0092d.chunk.css" rel="stylesheet"><link href="static/css/index.d7a93482.chunk.css" rel="stylesheet"></head><body style="background:#f5f5f5"><div class="demo" id="demo"></div><script src="static/js/runtime~index.f795885b.js"></script><script src="static/js/2.71a0092d.chunk.js"></script><script src="static/js/index.d7a93482.chunk.js"></script></body></html>

docs/manifest.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
2-
"index.css": "static/css/index.b2e6f73b.chunk.css",
3-
"index.js": "static/js/index.b2e6f73b.chunk.js",
2+
"index.css": "static/css/index.d7a93482.chunk.css",
3+
"index.js": "static/js/index.d7a93482.chunk.js",
44
"runtime~index.js": "static/js/runtime~index.f795885b.js",
55
"static/css/2.71a0092d.chunk.css": "static/css/2.71a0092d.chunk.css",
66
"static/js/2.71a0092d.chunk.js": "static/js/2.71a0092d.chunk.js",

docs/static/js/index.b2e6f73b.chunk.js

Lines changed: 0 additions & 1 deletion
This file was deleted.

docs/static/js/index.d7a93482.chunk.js

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

esm/Form.js

Lines changed: 24 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,10 @@ function (_React$Component) {
4141
formValue: _this.props.defaultFormValue || {}
4242
});
4343

44+
_defineProperty(_assertThisInitialized(_this), "handleSubmit", function (e) {
45+
e.preventDefault();
46+
});
47+
4448
return _this;
4549
}
4650

@@ -63,7 +67,8 @@ function (_React$Component) {
6367
var idx = this.fields.indexOf(field);
6468

6569
if (idx !== -1) {
66-
var name = field.props.name;
70+
var name = field.props.name; // eslint-disable-next-line
71+
6772
this.state.formError[name] = null;
6873
this.fields.splice(idx, 1);
6974
}
@@ -75,11 +80,14 @@ function (_React$Component) {
7580
initialFormValue[field.props.name] = field._initialValue;
7681
});
7782
this.fieldLocks = {};
78-
this.formLockId++;
79-
this.state.validatingFields = {};
80-
this.state.formValue = initialFormValue; // this.formError = {};
83+
this.formLockId = 1; // eslint-disable-next-line
84+
85+
this.state.validatingFields = {}; // eslint-disable-next-line
86+
87+
this.state.formValue = initialFormValue; // eslint-disable-next-line
8188

82-
this.cleanErrors(); // this.setState({
89+
this.state.formError = {}; // this.cleanErrors();
90+
// this.setState({
8391
// formError: {},
8492
// validatingFields: {},
8593
// formValue: initialFormValue
@@ -96,10 +104,12 @@ function (_React$Component) {
96104
initialValue = field._initialValue;
97105
}
98106
});
99-
this.fieldLocks[name] = 1;
100-
this.state.validatingFields[name] = false; // this.formError[name] = null;
107+
this.fieldLocks[name] = 1; // eslint-disable-next-line
108+
109+
this.state.validatingFields[name] = false; // eslint-disable-next-line
110+
111+
this.state.formError[name] = null; // this.cleanError(name);
101112

102-
this.cleanError(name);
103113
this.setValue(name, initialValue, cb);
104114
};
105115

@@ -435,6 +445,8 @@ function (_React$Component) {
435445
var validCounter = 0;
436446

437447
var updateFormState = function updateFormState() {
448+
if (lockId !== _this3.formLockId) return;
449+
438450
_this3.setState({
439451
formError: formError,
440452
validatingFields: validatingFields
@@ -454,9 +466,12 @@ function (_React$Component) {
454466
callback(allErrors.length ? allErrors : null, formValue, true
455467
/* abort state */
456468
);
469+
console.log("abort");
457470
return;
458471
}
459472

473+
console.log("validate");
474+
460475
_this3.setState({
461476
formError: formError,
462477
validatingFields: {}
@@ -489,7 +504,6 @@ function (_React$Component) {
489504
asyncTimer = null;
490505
if (hasUpdate) return;
491506
hasUpdate = true;
492-
if (lockId !== _this3.formLockId) return;
493507
updateFormState();
494508
}, asyncTestDelay);
495509

@@ -560,7 +574,7 @@ function (_React$Component) {
560574
}, React.createElement(Component, {
561575
style: style,
562576
className: classnames(prefixCls, className),
563-
onSubmit: onSubmit
577+
onSubmit: onSubmit || this.handleSubmit
564578
}, typeof children === "function" ? children(this) : children));
565579
};
566580

esm/FormItem.js

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -251,7 +251,9 @@ function (_React$Component) {
251251
};
252252

253253
_proto.getFormItemContext = function getFormItemContext() {
254-
return Object.create(this);
254+
return {
255+
formItem: this
256+
};
255257
};
256258

257259
_proto.render = function render() {
@@ -262,6 +264,7 @@ function (_React$Component) {
262264
var _this$props2 = this.props,
263265
name = _this$props2.name,
264266
label = _this$props2.label,
267+
showRequiredMark = _this$props2.showRequiredMark,
265268
required = _this$props2.required,
266269
className = _this$props2.className,
267270
prefixCls = _this$props2.prefixCls,
@@ -294,7 +297,7 @@ function (_React$Component) {
294297
}, React.createElement("div", {
295298
style: style,
296299
ref: this.saveDOM,
297-
className: classnames(prefixCls, (_classnames = {}, _classnames[prefixCls + "-inline"] = inline, _classnames[prefixCls + "-" + labelPosition] = labelPosition, _classnames["has-error"] = hasError, _classnames["is-validating"] = isValidating, _classnames["is-required"] = required, _classnames["" + className] = className, _classnames))
300+
className: classnames(prefixCls, (_classnames = {}, _classnames[prefixCls + "-inline"] = inline, _classnames[prefixCls + "-" + labelPosition] = labelPosition, _classnames["has-error"] = hasError, _classnames["is-validating"] = isValidating, _classnames["is-required"] = required || showRequiredMark, _classnames["" + className] = className, _classnames))
298301
}, label && React.createElement("label", {
299302
htmlFor: this.getProp("labelFor"),
300303
className: classnames((_classnames2 = {}, _classnames2[prefixCls + "-label"] = true, _classnames2[prefixCls + "-label-left"] = labelAlign === "left" && labelPosition === "left", _classnames2), this.getProp("labelClassName")),
@@ -327,6 +330,7 @@ FormItem.propTypes = process.env.NODE_ENV !== "production" ? {
327330
controlStyle: PropTypes.object,
328331
controlClassName: PropTypes.string,
329332
validator: PropTypes.oneOfType([PropTypes.func, PropTypes.array]),
333+
showRequiredMark: PropTypes.bool,
330334
required: PropTypes.bool,
331335
requiredMessage: PropTypes.string,
332336
clearErrorOnFocus: PropTypes.bool,
@@ -338,6 +342,7 @@ FormItem.propTypes = process.env.NODE_ENV !== "production" ? {
338342
inline: PropTypes.bool
339343
} : {};
340344
FormItem.defaultProps = {
341-
prefixCls: "nex-form-item"
345+
prefixCls: "nex-form-item",
346+
showRequiredMark: false
342347
};
343348
export default FormItem;

esm/index.d.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -63,6 +63,7 @@ declare namespace ReactWidgetForm {
6363
labelAlign?: "left" | "right";
6464
controlStyle?: React.CSSProperties;
6565
controlClassName?: string;
66+
showRequiredMark?: boolean;
6667
required?: boolean;
6768
requiredMessage?: string;
6869
clearErrorOnFocus?: boolean;

esm/useFormItem.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,5 +2,6 @@
22
import React from "react";
33
import FormItemContext from "./FormItemContext";
44
export default (function () {
5-
return React.useContext(FormItemContext);
5+
var context = React.useContext(FormItemContext);
6+
return context.formItem;
67
});

0 commit comments

Comments
 (0)