还是能缓存

This commit is contained in:
liaoxuezhi 2019-11-26 19:04:47 +08:00
parent bbb431600d
commit bbbb027fce
2 changed files with 215 additions and 222 deletions

View File

@ -1,264 +1,265 @@
.#{$ns}Form {
font-size: $Form-fontSize;
position: relative;
font-size: $Form-fontSize;
position: relative;
&--quickEdit .#{$ns}Form-item:last-child {
margin-bottom: 0;
}
&--quickEdit .#{$ns}Form-item:last-child {
margin-bottom: 0;
}
&--inline {
>.#{$ns}PlainField {
display: inline-block;
padding-top: $Form-input-paddingY;
// padding-bottom: $Form-input-paddingY;
}
&--inline {
> .#{$ns}PlainField {
display: inline-block;
padding-top: $Form-input-paddingY;
// padding-bottom: $Form-input-paddingY;
}
}
}
.#{$ns}Form-label {
font-weight: $fontWeightNormal;
margin-bottom: px2rem(5px);
display: inline-block;
max-width: 100%;
position: relative;
font-weight: $fontWeightNormal;
margin-bottom: px2rem(5px);
display: inline-block;
max-width: 100%;
position: relative;
>span {
position: relative;
}
> span {
position: relative;
}
}
.#{$ns}Form-star {
color: $red;
font-size: $fontSizeXs;
position: absolute;
left: px2rem(-6px);
top: px2rem(3px);
line-height: 1;
color: $red;
font-size: $fontSizeXs;
position: absolute;
left: px2rem(-6px);
top: px2rem(3px);
line-height: 1;
}
.#{$ns}Form-feedback {
color: $danger;
margin: $Form-input-marginBottom 0 0;
padding-left: $gap-base;
font-size: $fontSizeSm;
color: $danger;
margin: $Form-input-marginBottom 0 0;
padding-left: $gap-base;
font-size: $fontSizeSm;
}
.#{$ns}Form-description {
display: block;
color: $Form-description-color;
margin: $Form-input-marginBottom 0 0;
font-size: $Form-description-fontSize;
display: block;
color: $Form-description-color;
margin: $Form-input-marginBottom 0 0;
font-size: $Form-description-fontSize;
}
.#{$ns}Form-hint {
display: inline-block;
margin-left: $gap-sm;
padding-top: $Form-input-paddingY;
vertical-align: top;
display: inline-block;
margin-left: $gap-sm;
padding-top: $Form-input-paddingY;
vertical-align: top;
}
.#{$ns}Form-item {
margin-bottom: $Form-item-gap;
margin-bottom: $Form-item-gap;
.#{$ns}Grid-form>&:last-child {
margin-bottom: 0;
.#{$ns}Grid-form > &:last-child {
margin-bottom: 0;
}
.#{$ns}Form--inline > &--inline {
margin-bottom: $Form-item-gap/2;
margin-right: $Form-item-gap/2;
&:last-child {
margin-right: 0;
margin-bottom: 0;
}
}
.#{$ns}Form--inline>&--inline {
margin-bottom: $Form-item-gap/2;
margin-right: $Form-item-gap/2;
.#{$ns}Form-remark {
margin-top: ($Form-input-height - $fontSizeBase) / 2;
vertical-align: top;
}
&:last-child {
margin-right: 0;
margin-bottom: 0;
}
&--horizontal {
> .#{$ns}Form-label {
text-align: $Form--horizontal-label-align;
white-space: $Form--horizontal-label-whiteSpace;
}
}
.#{$ns}Form-remark {
margin-top: ($Form-input-height - $fontSizeBase) / 2;
vertical-align: top;
&--normal {
> .#{$ns}Form-label {
display: block;
}
}
&--horizontal {
>.#{$ns}Form-label {
text-align: $Form--horizontal-label-align;
white-space: $Form--horizontal-label-whiteSpace;
}
}
&--normal {
>.#{$ns}Form-label {
display: block;
}
}
&.is-error>.#{$ns}Form-label {
color: $danger;
}
&.is-error > .#{$ns}Form-label {
color: $danger;
}
}
.#{$ns}Form-placeholder {
color: $Form-input-placeholderColor;
color: $Form-input-placeholderColor;
}
@include media-breakpoint-up(sm) {
.#{$ns}Form-control--sizeXs {
min-width: $Form-control-widthXs;
width: auto;
display: inline-block;
vertical-align: top;
}
.#{$ns}Form-control--sizeXs {
min-width: $Form-control-widthXs;
width: auto;
display: inline-block;
vertical-align: top;
}
.#{$ns}Form-control--sizeSm {
min-width: $Form-control-widthSm;
width: auto;
display: inline-block;
vertical-align: top;
}
.#{$ns}Form-control--sizeSm {
min-width: $Form-control-widthSm;
width: auto;
display: inline-block;
vertical-align: top;
}
.#{$ns}Form-control--sizeMd {
min-width: $Form-control-widthMd;
width: auto;
display: inline-block;
vertical-align: top;
}
.#{$ns}Form-control--sizeMd {
min-width: $Form-control-widthMd;
width: auto;
display: inline-block;
vertical-align: top;
}
.#{$ns}Form-control--sizeLg {
min-width: $Form-control-widthLg;
width: auto;
display: inline-block;
vertical-align: top;
}
.#{$ns}Form-control--sizeLg {
min-width: $Form-control-widthLg;
width: auto;
display: inline-block;
vertical-align: top;
}
.#{$ns}Form-item {
&--horizontal {
display: flex;
flex-wrap: nowrap;
margin-left: -$Form--horizontal-gutterWidth / 2;
margin-right: -$Form--horizontal-gutterWidth / 2;
.#{$ns}Form-item {
&--horizontal {
display: flex;
flex-wrap: nowrap;
margin-left: -$Form--horizontal-gutterWidth / 2;
margin-right: -$Form--horizontal-gutterWidth / 2;
>* {
padding-left: $Form--horizontal-gutterWidth / 2;
padding-right: $Form--horizontal-gutterWidth / 2;
}
> * {
padding-left: $Form--horizontal-gutterWidth / 2;
padding-right: $Form--horizontal-gutterWidth / 2;
}
>.#{$ns}Form-label,
>.#{$ns}Form-value {
flex-basis: 0;
flex-grow: 1;
max-width: 100%;
}
.#{$ns}Form-itemColumn--xs,
.#{$ns}Form-itemColumn--sm,
.#{$ns}Form-itemColumn--normal,
.#{$ns}Form-itemColumn--md,
.#{$ns}Form-itemColumn--lg {
flex-grow: unset;
flex-basis: unset;
}
>.#{$ns}Form-label {
padding-top: $Form-label-paddingTop;
margin-bottom: 0;
}
.#{$ns}Form-itemColumn--xs {
width: $Form--horizontal-label-widthXs;
}
.#{$ns}Form-itemColumn--sm {
width: $Form--horizontal-label-widthSm;
}
.#{$ns}Form-itemColumn--normal {
width: $Form--horizontal-label-widthBase;
}
.#{$ns}Form-itemColumn--md {
width: $Form--horizontal-label-widthMd;
}
.#{$ns}Form-itemColumn--lg {
width: $Form--horizontal-label-widthLg;
}
@for $i from (1) through $Form--horizontal-columns {
.#{$ns}Form-itemColumn--#{$i} {
flex: 0 0 percentage($i / $Form--horizontal-columns);
max-width: percentage($i / $Form--horizontal-columns);
min-height: 1px;
}
}
}
&--inline {
display: inline-block;
vertical-align: top;
>.#{$ns}Form-label {
padding-top: $Form-label-paddingTop;
margin-bottom: 0;
margin-right: $Form-item-gap/2;
.#{$ns}Form-star {
position: static;
}
}
>.#{$ns}Form-value {
display: inline;
>.#{$ns}Form-control {
vertical-align: top;
display: inline-block;
}
>.#{$ns}Form-control.#{$ns}InputGroup {
display: inline-flex;
}
>.#{$ns}TextControl--withAddOn {
display: inline-flex;
}
}
}
}
.#{$ns}Form-row {
display: flex;
flex-wrap: wrap;
margin-left: -$Form-row-gutterWidth / 2;
margin-right: -$Form-row-gutterWidth / 2;
align-items: flex-start;
>* {
padding-left: $Form-row-gutterWidth / 2;
padding-right: $Form-row-gutterWidth / 2;
}
}
.#{$ns}Form-col {
> .#{$ns}Form-label,
> .#{$ns}Form-value {
flex-basis: 0;
flex-grow: 1;
flex-shrink: 1;
max-width: 100%;
width: 0;
}
.#{$ns}Form-itemColumn--xs,
.#{$ns}Form-itemColumn--sm,
.#{$ns}Form-itemColumn--normal,
.#{$ns}Form-itemColumn--md,
.#{$ns}Form-itemColumn--lg {
flex-grow: unset;
flex-basis: unset;
}
> .#{$ns}Form-label {
padding-top: $Form-label-paddingTop;
margin-bottom: 0;
}
.#{$ns}Form-itemColumn--xs {
width: $Form--horizontal-label-widthXs;
}
.#{$ns}Form-itemColumn--sm {
width: $Form--horizontal-label-widthSm;
}
.#{$ns}Form-itemColumn--normal {
width: $Form--horizontal-label-widthBase;
}
.#{$ns}Form-itemColumn--md {
width: $Form--horizontal-label-widthMd;
}
.#{$ns}Form-itemColumn--lg {
width: $Form--horizontal-label-widthLg;
}
@for $i from (1) through $Form--horizontal-columns {
.#{$ns}Form-itemColumn--#{$i} {
flex: 0 0 percentage($i / $Form--horizontal-columns);
max-width: percentage($i / $Form--horizontal-columns);
min-height: 1px;
}
}
}
.#{$ns}Form-rowInner {
display: flex;
flex-wrap: nowrap;
&--inline {
display: inline-block;
vertical-align: top;
>.#{$ns}Form-label {
display: inline-block;
vertical-align: top;
padding-top: $Form-label-paddingTop;
padding-right: $Form-row-gutterWidth;
> .#{$ns}Form-label {
padding-top: $Form-label-paddingTop;
margin-bottom: 0;
margin-right: $Form-item-gap/2;
.#{$ns}Form-star {
position: static;
}
}
> .#{$ns}Form-value {
display: inline;
> .#{$ns}Form-control {
vertical-align: top;
display: inline-block;
}
>.#{$ns}Form-control {
flex-basis: 0;
flex-grow: 1;
> .#{$ns}Form-control.#{$ns}InputGroup {
display: inline-flex;
}
> .#{$ns}TextControl--withAddOn {
display: inline-flex;
}
}
}
}
.#{$ns}Form-row {
display: flex;
flex-wrap: wrap;
margin-left: -$Form-row-gutterWidth / 2;
margin-right: -$Form-row-gutterWidth / 2;
align-items: flex-start;
> * {
padding-left: $Form-row-gutterWidth / 2;
padding-right: $Form-row-gutterWidth / 2;
}
}
.#{$ns}Form-col {
flex-basis: 0;
flex-grow: 1;
flex-shrink: 1;
}
.#{$ns}Form-rowInner {
display: flex;
flex-wrap: nowrap;
> .#{$ns}Form-label {
display: inline-block;
vertical-align: top;
padding-top: $Form-label-paddingTop;
padding-right: $Form-row-gutterWidth;
}
> .#{$ns}Form-control {
flex-basis: 0;
flex-grow: 1;
}
}
}

View File

@ -85,9 +85,6 @@ export const FormItemStore = types
return self.errorData.map(item => item.msg);
}
let lastQueryValue: any;
let lastResult: any = [];
return {
get form(): any {
return getForm();
@ -117,13 +114,8 @@ export const FormItemStore = types
},
getSelectedOptions: (value: any = getValue()) => {
if (value === lastQueryValue) {
return lastResult;
}
lastQueryValue = value;
if (typeof value === 'undefined') {
return (lastResult = []);
return [];
}
const selected = Array.isArray(value)
@ -183,7 +175,7 @@ export const FormItemStore = types
unMatched && selectedOptions.push(unMatched);
});
return (lastResult = selectedOptions);
return selectedOptions;
}
};
})