fix: input clear not focus
parent
d58a0f21df
commit
cbef867da8
|
@ -1 +1 @@
|
||||||
Subproject commit 2d8d146c97bb030ac9fe572741483db8f7436460
|
Subproject commit e58ddcdb3436fbf430e69953053d73114ce6ce6b
|
|
@ -1,6 +1,6 @@
|
||||||
import { inject } from 'vue';
|
import { inject } from 'vue';
|
||||||
import PropTypes from '../_util/vue-types';
|
import PropTypes from '../_util/vue-types';
|
||||||
import { filterEmpty, getSlot } from '../_util/props-util';
|
import { getSlot } from '../_util/props-util';
|
||||||
import { ConfigConsumerProps } from '../config-provider';
|
import { ConfigConsumerProps } from '../config-provider';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
|
@ -34,6 +34,6 @@ export default {
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
render() {
|
render() {
|
||||||
return <span class={this.classes}>{filterEmpty(getSlot(this))}</span>;
|
return <span class={this.classes}>{getSlot(this)}</span>;
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
|
@ -114,14 +114,14 @@ export default {
|
||||||
}
|
}
|
||||||
if (!hasProp(this, 'value')) {
|
if (!hasProp(this, 'value')) {
|
||||||
this.stateValue = value;
|
this.stateValue = value;
|
||||||
this.$nextTick(() => {
|
|
||||||
callback && callback();
|
|
||||||
});
|
|
||||||
} else {
|
} else {
|
||||||
this.$forceUpdate();
|
this.$forceUpdate();
|
||||||
}
|
}
|
||||||
|
this.$nextTick(() => {
|
||||||
|
callback && callback();
|
||||||
|
});
|
||||||
},
|
},
|
||||||
onChange(e) {
|
triggerChange(e) {
|
||||||
this.$emit('update:value', e.target.value);
|
this.$emit('update:value', e.target.value);
|
||||||
this.$emit('change', e);
|
this.$emit('change', e);
|
||||||
this.$emit('input', e);
|
this.$emit('input', e);
|
||||||
|
@ -130,11 +130,12 @@ export default {
|
||||||
this.setValue('', () => {
|
this.setValue('', () => {
|
||||||
this.focus();
|
this.focus();
|
||||||
});
|
});
|
||||||
resolveOnChange(this.input, e, this.onChange);
|
resolveOnChange(this.input, e, this.triggerChange);
|
||||||
},
|
},
|
||||||
renderInput(prefixCls, { addonBefore, addonAfter }) {
|
renderInput(prefixCls, { addonBefore, addonAfter }) {
|
||||||
const otherProps = omit(this.$props, [
|
const otherProps = omit(this.$props, [
|
||||||
'prefixCls',
|
'prefixCls',
|
||||||
|
'onPressEnter',
|
||||||
'addonBefore',
|
'addonBefore',
|
||||||
'addonAfter',
|
'addonAfter',
|
||||||
'prefix',
|
'prefix',
|
||||||
|
@ -185,7 +186,7 @@ export default {
|
||||||
// https://github.com/vueComponent/ant-design-vue/issues/2203
|
// https://github.com/vueComponent/ant-design-vue/issues/2203
|
||||||
if (((e.isComposing || composing) && this.lazy) || this.stateValue === value) return;
|
if (((e.isComposing || composing) && this.lazy) || this.stateValue === value) return;
|
||||||
this.setValue(value, this.clearPasswordValueAttribute);
|
this.setValue(value, this.clearPasswordValueAttribute);
|
||||||
resolveOnChange(this.input, e, this.onChange);
|
resolveOnChange(this.input, e, this.triggerChange);
|
||||||
},
|
},
|
||||||
handleKeyDown(e) {
|
handleKeyDown(e) {
|
||||||
if (e.keyCode === 13) {
|
if (e.keyCode === 13) {
|
||||||
|
|
|
@ -8,6 +8,7 @@ import BaseMixin from '../_util/BaseMixin';
|
||||||
import inputProps from './inputProps';
|
import inputProps from './inputProps';
|
||||||
import PropTypes from '../_util/vue-types';
|
import PropTypes from '../_util/vue-types';
|
||||||
import { getOptionProps } from '../_util/props-util';
|
import { getOptionProps } from '../_util/props-util';
|
||||||
|
import syncWatch from '../_util/syncWatch';
|
||||||
|
|
||||||
const RESIZE_STATUS_NONE = 0;
|
const RESIZE_STATUS_NONE = 0;
|
||||||
const RESIZE_STATUS_RESIZING = 1;
|
const RESIZE_STATUS_RESIZING = 1;
|
||||||
|
@ -17,6 +18,7 @@ const TextAreaProps = {
|
||||||
...inputProps,
|
...inputProps,
|
||||||
autosize: PropTypes.oneOfType([Object, Boolean]),
|
autosize: PropTypes.oneOfType([Object, Boolean]),
|
||||||
autoSize: PropTypes.oneOfType([Object, Boolean]),
|
autoSize: PropTypes.oneOfType([Object, Boolean]),
|
||||||
|
onResize: PropTypes.func,
|
||||||
};
|
};
|
||||||
const ResizableTextArea = {
|
const ResizableTextArea = {
|
||||||
name: 'ResizableTextArea',
|
name: 'ResizableTextArea',
|
||||||
|
@ -37,11 +39,11 @@ const ResizableTextArea = {
|
||||||
raf.cancel(this.resizeFrameId);
|
raf.cancel(this.resizeFrameId);
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
value() {
|
value: syncWatch(function() {
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.resizeTextarea();
|
this.resizeTextarea();
|
||||||
});
|
});
|
||||||
},
|
}),
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
saveTextArea(textArea) {
|
saveTextArea(textArea) {
|
||||||
|
|
|
@ -19,6 +19,7 @@ export default {
|
||||||
...inputProps,
|
...inputProps,
|
||||||
// 不能设置默认值 https://github.com/vueComponent/ant-design-vue/issues/1916
|
// 不能设置默认值 https://github.com/vueComponent/ant-design-vue/issues/1916
|
||||||
enterButton: PropTypes.any,
|
enterButton: PropTypes.any,
|
||||||
|
onSearch: PropTypes.func,
|
||||||
},
|
},
|
||||||
setup() {
|
setup() {
|
||||||
return {
|
return {
|
||||||
|
@ -29,13 +30,14 @@ export default {
|
||||||
saveInput(node) {
|
saveInput(node) {
|
||||||
this.input = node;
|
this.input = node;
|
||||||
},
|
},
|
||||||
onChange(e) {
|
handleChange(e) {
|
||||||
if (e && e.target && e.type === 'click') {
|
if (e && e.target && e.type === 'click') {
|
||||||
this.$emit('search', e.target.value, e);
|
this.$emit('search', e.target.value, e);
|
||||||
}
|
}
|
||||||
|
this.$emit('update:value', e.target.value);
|
||||||
this.$emit('change', e);
|
this.$emit('change', e);
|
||||||
},
|
},
|
||||||
onSearch(e) {
|
handleSearch(e) {
|
||||||
if (this.loading || this.disabled) {
|
if (this.loading || this.disabled) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
@ -78,7 +80,7 @@ export default {
|
||||||
if (enterButton) return suffix;
|
if (enterButton) return suffix;
|
||||||
|
|
||||||
const icon = (
|
const icon = (
|
||||||
<SearchOutlined class={`${prefixCls}-icon`} key="searchIcon" onClick={this.onSearch} />
|
<SearchOutlined class={`${prefixCls}-icon`} key="searchIcon" onClick={this.handleSearch} />
|
||||||
);
|
);
|
||||||
|
|
||||||
if (suffix) {
|
if (suffix) {
|
||||||
|
@ -114,7 +116,7 @@ export default {
|
||||||
key: 'enterButton',
|
key: 'enterButton',
|
||||||
class: isAntdButton ? btnClassName : '',
|
class: isAntdButton ? btnClassName : '',
|
||||||
...(isAntdButton ? { size } : {}),
|
...(isAntdButton ? { size } : {}),
|
||||||
onClick: this.onSearch,
|
onClick: this.handleSearch,
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
button = (
|
button = (
|
||||||
|
@ -124,7 +126,7 @@ export default {
|
||||||
size={size}
|
size={size}
|
||||||
disabled={disabled}
|
disabled={disabled}
|
||||||
key="enterButton"
|
key="enterButton"
|
||||||
onClick={this.onSearch}
|
onClick={this.handleSearch}
|
||||||
>
|
>
|
||||||
{enterButton === true || enterButton === '' ? <SearchOutlined /> : enterButton}
|
{enterButton === true || enterButton === '' ? <SearchOutlined /> : enterButton}
|
||||||
</Button>
|
</Button>
|
||||||
|
@ -149,6 +151,7 @@ export default {
|
||||||
delete restProps.loading;
|
delete restProps.loading;
|
||||||
delete restProps.enterButton;
|
delete restProps.enterButton;
|
||||||
delete restProps.addonBefore;
|
delete restProps.addonBefore;
|
||||||
|
delete restProps['onUpdate:value'];
|
||||||
const getPrefixCls = this.configProvider.getPrefixCls;
|
const getPrefixCls = this.configProvider.getPrefixCls;
|
||||||
const prefixCls = getPrefixCls('input-search', customizePrefixCls);
|
const prefixCls = getPrefixCls('input-search', customizePrefixCls);
|
||||||
const inputPrefixCls = getPrefixCls('input', customizeInputPrefixCls);
|
const inputPrefixCls = getPrefixCls('input', customizeInputPrefixCls);
|
||||||
|
@ -175,8 +178,8 @@ export default {
|
||||||
addonAfter: this.renderAddonAfter(prefixCls),
|
addonAfter: this.renderAddonAfter(prefixCls),
|
||||||
addonBefore,
|
addonBefore,
|
||||||
class: inputClassName,
|
class: inputClassName,
|
||||||
onPressEnter: this.onSearch,
|
onPressEnter: this.handleSearch,
|
||||||
onChange: this.onChange,
|
onChange: this.handleChange,
|
||||||
};
|
};
|
||||||
return <Input {...inputProps} ref={this.saveInput} />;
|
return <Input {...inputProps} ref={this.saveInput} />;
|
||||||
},
|
},
|
||||||
|
|
|
@ -41,12 +41,12 @@ export default {
|
||||||
setValue(value, callback) {
|
setValue(value, callback) {
|
||||||
if (!hasProp(this, 'value')) {
|
if (!hasProp(this, 'value')) {
|
||||||
this.stateValue = value;
|
this.stateValue = value;
|
||||||
this.$nextTick(() => {
|
|
||||||
callback && callback();
|
|
||||||
});
|
|
||||||
} else {
|
} else {
|
||||||
this.$forceUpdate();
|
this.$forceUpdate();
|
||||||
}
|
}
|
||||||
|
this.$nextTick(() => {
|
||||||
|
callback && callback();
|
||||||
|
});
|
||||||
},
|
},
|
||||||
handleKeyDown(e) {
|
handleKeyDown(e) {
|
||||||
if (e.keyCode === 13) {
|
if (e.keyCode === 13) {
|
||||||
|
@ -54,7 +54,7 @@ export default {
|
||||||
}
|
}
|
||||||
this.$emit('keydown', e);
|
this.$emit('keydown', e);
|
||||||
},
|
},
|
||||||
onChange(e) {
|
triggerChange(e) {
|
||||||
this.$emit('update:value', e.target.value);
|
this.$emit('update:value', e.target.value);
|
||||||
this.$emit('change', e);
|
this.$emit('change', e);
|
||||||
this.$emit('input', e);
|
this.$emit('input', e);
|
||||||
|
@ -66,7 +66,7 @@ export default {
|
||||||
this.setValue(e.target.value, () => {
|
this.setValue(e.target.value, () => {
|
||||||
this.resizableTextArea.resizeTextarea();
|
this.resizableTextArea.resizeTextarea();
|
||||||
});
|
});
|
||||||
resolveOnChange(this.resizableTextArea.textArea, e, this.onChange);
|
resolveOnChange(this.resizableTextArea.textArea, e, this.triggerChange);
|
||||||
},
|
},
|
||||||
|
|
||||||
focus() {
|
focus() {
|
||||||
|
@ -88,7 +88,7 @@ export default {
|
||||||
this.resizableTextArea.renderTextArea();
|
this.resizableTextArea.renderTextArea();
|
||||||
this.focus();
|
this.focus();
|
||||||
});
|
});
|
||||||
resolveOnChange(this.resizableTextArea.textArea, e, this.onChange);
|
resolveOnChange(this.resizableTextArea.textArea, e, this.triggerChange);
|
||||||
},
|
},
|
||||||
|
|
||||||
renderTextArea(prefixCls) {
|
renderTextArea(prefixCls) {
|
||||||
|
|
|
@ -32,4 +32,12 @@ export default {
|
||||||
},
|
},
|
||||||
maxlength: PropTypes.number,
|
maxlength: PropTypes.number,
|
||||||
loading: PropTypes.bool,
|
loading: PropTypes.bool,
|
||||||
|
onPressEnter: PropTypes.func,
|
||||||
|
onKeydown: PropTypes.func,
|
||||||
|
onKeyup: PropTypes.func,
|
||||||
|
onFocus: PropTypes.func,
|
||||||
|
onBlur: PropTypes.func,
|
||||||
|
onChange: PropTypes.func,
|
||||||
|
onInput: PropTypes.func,
|
||||||
|
'onUpdate:value': PropTypes.func,
|
||||||
};
|
};
|
||||||
|
|
|
@ -4,7 +4,7 @@
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import demo from '../antdv-demo/docs/grid/demo/index';
|
import demo from '../antdv-demo/docs/input/demo/index';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
|
|
Loading…
Reference in New Issue