mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
[improvement] reduce simple computed (#2530)
This commit is contained in:
parent
f41b9d3bd3
commit
1d2bd12fef
@ -15,19 +15,6 @@ export default sfc({
|
||||
showSearchResult: Boolean
|
||||
},
|
||||
|
||||
computed: {
|
||||
searchList() {
|
||||
if (this.showSearchResult && this.focused) {
|
||||
return this.searchResult || [];
|
||||
}
|
||||
return [];
|
||||
},
|
||||
|
||||
showIcon() {
|
||||
return this.value && this.focused;
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
onSelect(express) {
|
||||
this.$emit('select-search', express);
|
||||
@ -36,6 +23,37 @@ export default sfc({
|
||||
},
|
||||
|
||||
render(h) {
|
||||
const { value, focused, searchResult } = this;
|
||||
|
||||
const Finish = value && focused && android && (
|
||||
<div
|
||||
slot="icon"
|
||||
class={bem('finish')}
|
||||
onClick={() => {
|
||||
this.$refs.field.blur();
|
||||
}}
|
||||
>
|
||||
{t('complete')}
|
||||
</div>
|
||||
);
|
||||
|
||||
const SearchList =
|
||||
focused &&
|
||||
searchResult &&
|
||||
this.showSearchResult &&
|
||||
searchResult.map(express => (
|
||||
<Cell
|
||||
key={express.name + express.address}
|
||||
title={express.name}
|
||||
label={express.address}
|
||||
icon="location-o"
|
||||
clickable
|
||||
onClick={() => {
|
||||
this.onSelect(express);
|
||||
}}
|
||||
/>
|
||||
));
|
||||
|
||||
return (
|
||||
<Cell class={bem()}>
|
||||
<Field
|
||||
@ -51,30 +69,9 @@ export default sfc({
|
||||
placeholder={t('placeholder')}
|
||||
{...{ on: this.$listeners }}
|
||||
>
|
||||
{this.showIcon && android && (
|
||||
<div
|
||||
slot="icon"
|
||||
class={bem('finish')}
|
||||
onClick={() => {
|
||||
this.$refs.field.blur();
|
||||
}}
|
||||
>
|
||||
{t('complete')}
|
||||
</div>
|
||||
)}
|
||||
{Finish}
|
||||
</Field>
|
||||
{this.searchList.map(express => (
|
||||
<Cell
|
||||
key={express.name + express.address}
|
||||
title={express.name}
|
||||
label={express.address}
|
||||
icon="location-o"
|
||||
clickable
|
||||
onClick={() => {
|
||||
this.onSelect(express);
|
||||
}}
|
||||
/>
|
||||
))}
|
||||
{SearchList}
|
||||
</Cell>
|
||||
);
|
||||
}
|
||||
|
@ -74,11 +74,6 @@ export default sfc({
|
||||
},
|
||||
|
||||
computed: {
|
||||
// hide bottom field when use search && detail get focused
|
||||
hideBottomFields() {
|
||||
return this.searchResult.length && this.detailFocused;
|
||||
},
|
||||
|
||||
areaListLoaded() {
|
||||
return isObj(this.areaList) && Object.keys(this.areaList).length;
|
||||
},
|
||||
@ -220,9 +215,12 @@ export default sfc({
|
||||
},
|
||||
|
||||
render(h) {
|
||||
const { data, errorInfo, hideBottomFields } = this;
|
||||
const { data, errorInfo } = this;
|
||||
const onFocus = name => () => this.onFocus(name);
|
||||
|
||||
// hide bottom field when use search && detail get focused
|
||||
const hideBottomFields = this.searchResult.length && this.detailFocused;
|
||||
|
||||
return (
|
||||
<div class={bem()}>
|
||||
<Field
|
||||
|
@ -41,13 +41,6 @@ export default sfc({
|
||||
|
||||
displayColumns() {
|
||||
return this.columns.slice(0, +this.columnsNum);
|
||||
},
|
||||
|
||||
listeners() {
|
||||
return {
|
||||
...this.$listeners,
|
||||
change: this.onChange
|
||||
};
|
||||
}
|
||||
},
|
||||
|
||||
@ -186,6 +179,11 @@ export default sfc({
|
||||
},
|
||||
|
||||
render(h) {
|
||||
const on = {
|
||||
...this.$listeners,
|
||||
change: this.onChange
|
||||
};
|
||||
|
||||
return (
|
||||
<Picker
|
||||
ref="picker"
|
||||
@ -197,7 +195,7 @@ export default sfc({
|
||||
columns={this.displayColumns}
|
||||
itemHeight={this.itemHeight}
|
||||
visibleItemCount={this.visibleItemCount}
|
||||
{...{ on: this.listeners }}
|
||||
{...{ on }}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
@ -14,12 +14,6 @@ export default sfc({
|
||||
arrowDirection: String
|
||||
},
|
||||
|
||||
computed: {
|
||||
arrowIcon() {
|
||||
return this.arrowDirection ? `arrow-${this.arrowDirection}` : 'arrow';
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
onClick() {
|
||||
this.$emit('click');
|
||||
@ -49,8 +43,9 @@ export default sfc({
|
||||
this.icon && <Icon class={bem('left-icon')} name={this.icon} />
|
||||
);
|
||||
|
||||
const arrowIcon = this.arrowDirection ? `arrow-${this.arrowDirection}` : 'arrow';
|
||||
const RightIcon = slots['right-icon'] || (
|
||||
this.isLink && <Icon class={bem('right-icon')} name={this.arrowIcon} />
|
||||
this.isLink && <Icon class={bem('right-icon')} name={arrowIcon} />
|
||||
);
|
||||
|
||||
return (
|
||||
|
Loading…
x
Reference in New Issue
Block a user