fix: ie trigger input when set placeholder
parent
6c05e25f23
commit
a857c253c9
|
@ -38,7 +38,7 @@ export default {
|
||||||
configProvider: { default: () => ConfigConsumerProps },
|
configProvider: { default: () => ConfigConsumerProps },
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
const { value, defaultValue } = this.$props;
|
const { value = '', defaultValue = '' } = this.$props;
|
||||||
return {
|
return {
|
||||||
stateValue: !hasProp(this, 'value') ? defaultValue : value,
|
stateValue: !hasProp(this, 'value') ? defaultValue : value,
|
||||||
};
|
};
|
||||||
|
@ -85,8 +85,7 @@ export default {
|
||||||
},
|
},
|
||||||
|
|
||||||
setValue(value, e) {
|
setValue(value, e) {
|
||||||
// https://github.com/vueComponent/ant-design-vue/issues/92
|
if (this.stateValue === value) {
|
||||||
if (isIE && !isIE9 && this.stateValue === value) {
|
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
if (!hasProp(this, 'value')) {
|
if (!hasProp(this, 'value')) {
|
||||||
|
@ -94,9 +93,7 @@ export default {
|
||||||
} else {
|
} else {
|
||||||
this.$forceUpdate();
|
this.$forceUpdate();
|
||||||
}
|
}
|
||||||
if (!e.target.composing) {
|
this.$emit('change.value', value);
|
||||||
this.$emit('change.value', value);
|
|
||||||
}
|
|
||||||
let event = e;
|
let event = e;
|
||||||
if (e.type === 'click' && this.$refs.input) {
|
if (e.type === 'click' && this.$refs.input) {
|
||||||
// click clear icon
|
// click clear icon
|
||||||
|
@ -124,8 +121,9 @@ export default {
|
||||||
},
|
},
|
||||||
|
|
||||||
handleChange(e) {
|
handleChange(e) {
|
||||||
if (e.target.composing) return;
|
const { value, composing } = e.target;
|
||||||
this.setValue(e.target.value, e);
|
if (composing || this.stateValue === value) return;
|
||||||
|
this.setValue(value, e);
|
||||||
},
|
},
|
||||||
|
|
||||||
renderClearIcon(prefixCls) {
|
renderClearIcon(prefixCls) {
|
||||||
|
|
|
@ -42,7 +42,7 @@ export default {
|
||||||
configProvider: { default: () => ConfigConsumerProps },
|
configProvider: { default: () => ConfigConsumerProps },
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
const { value, defaultValue } = this.$props;
|
const { value = '', defaultValue = '' } = this.$props;
|
||||||
return {
|
return {
|
||||||
stateValue: fixControlledValue(!hasProp(this, 'value') ? defaultValue : value),
|
stateValue: fixControlledValue(!hasProp(this, 'value') ? defaultValue : value),
|
||||||
nextFrameActionId: undefined,
|
nextFrameActionId: undefined,
|
||||||
|
@ -116,16 +116,16 @@ export default {
|
||||||
},
|
},
|
||||||
|
|
||||||
handleTextareaChange(e) {
|
handleTextareaChange(e) {
|
||||||
if (e.target.composing) return;
|
const { value, composing } = e.target;
|
||||||
|
if (composing || this.stateValue === value) return;
|
||||||
if (!hasProp(this, 'value')) {
|
if (!hasProp(this, 'value')) {
|
||||||
this.stateValue = e.target.value;
|
this.stateValue = value;
|
||||||
this.resizeTextarea();
|
this.resizeTextarea();
|
||||||
} else {
|
} else {
|
||||||
this.$forceUpdate();
|
this.$forceUpdate();
|
||||||
}
|
}
|
||||||
if (!e.target.composing) {
|
|
||||||
this.$emit('change.value', e.target.value);
|
this.$emit('change.value', value);
|
||||||
}
|
|
||||||
this.$emit('change', e);
|
this.$emit('change', e);
|
||||||
this.$emit('input', e);
|
this.$emit('input', e);
|
||||||
},
|
},
|
||||||
|
|
|
@ -81,13 +81,11 @@ const DateInput = {
|
||||||
});
|
});
|
||||||
this.__emit('clear', null);
|
this.__emit('clear', null);
|
||||||
},
|
},
|
||||||
onInputChange(event) {
|
onInputChange(e) {
|
||||||
if (event.target.composing) return;
|
const { value: str, composing } = e.target;
|
||||||
const str = event.target.value;
|
const { str: oldStr = '' } = this;
|
||||||
// https://github.com/vueComponent/ant-design-vue/issues/92
|
if (composing || oldStr === str) return;
|
||||||
if (isIE && !isIE9 && this.str === str) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
const { disabledDate, format, selectedValue } = this.$props;
|
const { disabledDate, format, selectedValue } = this.$props;
|
||||||
|
|
||||||
// 没有内容,合法并直接退出
|
// 没有内容,合法并直接退出
|
||||||
|
|
|
@ -32,9 +32,10 @@ export default {
|
||||||
return `${opt.value} ${this.locale.items_per_page}`;
|
return `${opt.value} ${this.locale.items_per_page}`;
|
||||||
},
|
},
|
||||||
handleChange(e) {
|
handleChange(e) {
|
||||||
if (e.target.composing) return;
|
const { value, composing } = e.target;
|
||||||
|
if (composing || this.goInputText === value) return;
|
||||||
this.setState({
|
this.setState({
|
||||||
goInputText: e.target.value,
|
goInputText: value,
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
handleBlur() {
|
handleBlur() {
|
||||||
|
|
|
@ -302,10 +302,11 @@ const Select = {
|
||||||
return value;
|
return value;
|
||||||
},
|
},
|
||||||
|
|
||||||
onInputChange(event) {
|
onInputChange(e) {
|
||||||
if (event.target.composing) return;
|
const { value: val, composing } = e.target;
|
||||||
|
const { _inputValue = '' } = this;
|
||||||
|
if (composing || _inputValue === val) return;
|
||||||
const { tokenSeparators } = this.$props;
|
const { tokenSeparators } = this.$props;
|
||||||
const val = event.target.value;
|
|
||||||
if (
|
if (
|
||||||
isMultipleOrTags(this.$props) &&
|
isMultipleOrTags(this.$props) &&
|
||||||
tokenSeparators.length &&
|
tokenSeparators.length &&
|
||||||
|
|
|
@ -62,13 +62,10 @@ const Header = {
|
||||||
},
|
},
|
||||||
|
|
||||||
methods: {
|
methods: {
|
||||||
onInputChange(event) {
|
onInputChange(e) {
|
||||||
if (event.target.composing) return;
|
const { value: str, composing } = e.target;
|
||||||
const str = event.target.value;
|
const { str: oldStr = '' } = this;
|
||||||
// https://github.com/vueComponent/ant-design-vue/issues/92
|
if (composing || oldStr === str) return;
|
||||||
if (isIE && !isIE9 && this.str === str) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
this.setState({
|
this.setState({
|
||||||
str,
|
str,
|
||||||
|
|
|
@ -86,12 +86,19 @@ const SearchInput = {
|
||||||
this.inputRef.current.blur();
|
this.inputRef.current.blur();
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
handleInputChange(e) {
|
||||||
|
const { value, composing } = e.target;
|
||||||
|
const { searchValue = '' } = this;
|
||||||
|
if (composing || searchValue === value) return;
|
||||||
|
this.vcTreeSelect.onSearchInputChange(e);
|
||||||
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const { searchValue, prefixCls, disabled, renderPlaceholder, open, ariaId } = this.$props;
|
const { searchValue, prefixCls, disabled, renderPlaceholder, open, ariaId } = this.$props;
|
||||||
const {
|
const {
|
||||||
vcTreeSelect: { onSearchInputChange, onSearchInputKeyDown },
|
vcTreeSelect: { onSearchInputKeyDown },
|
||||||
|
handleInputChange,
|
||||||
} = this;
|
} = this;
|
||||||
return (
|
return (
|
||||||
<span class={`${prefixCls}-search__field__wrap`}>
|
<span class={`${prefixCls}-search__field__wrap`}>
|
||||||
|
@ -108,7 +115,7 @@ const SearchInput = {
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
}}
|
}}
|
||||||
onInput={onSearchInputChange}
|
onInput={handleInputChange}
|
||||||
onKeydown={onSearchInputKeyDown}
|
onKeydown={onSearchInputKeyDown}
|
||||||
value={searchValue}
|
value={searchValue}
|
||||||
disabled={disabled}
|
disabled={disabled}
|
||||||
|
|
|
@ -790,7 +790,6 @@ const Select = {
|
||||||
},
|
},
|
||||||
|
|
||||||
onSearchInputChange(event) {
|
onSearchInputChange(event) {
|
||||||
if (event.target.composing) return;
|
|
||||||
const value = event.target.value;
|
const value = event.target.value;
|
||||||
const { _treeNodes: treeNodes, _valueEntities: valueEntities } = this.$data;
|
const { _treeNodes: treeNodes, _valueEntities: valueEntities } = this.$data;
|
||||||
const { filterTreeNode, treeNodeFilterProp } = this.$props;
|
const { filterTreeNode, treeNodeFilterProp } = this.$props;
|
||||||
|
|
|
@ -1,4 +1,5 @@
|
||||||
import Vue from 'vue';
|
import Vue from 'vue';
|
||||||
|
import Base from '../components/base';
|
||||||
// Vue.config.silent = true
|
// Vue.config.silent = true
|
||||||
|
|
||||||
/* eslint-disable global-require */
|
/* eslint-disable global-require */
|
||||||
|
@ -25,6 +26,7 @@ const mockMath = Object.create(global.Math);
|
||||||
mockMath.random = () => 0.5;
|
mockMath.random = () => 0.5;
|
||||||
global.Math = mockMath;
|
global.Math = mockMath;
|
||||||
|
|
||||||
|
Vue.use(Base);
|
||||||
Vue.component('transition-group', {
|
Vue.component('transition-group', {
|
||||||
props: ['tag'],
|
props: ['tag'],
|
||||||
render(createElement) {
|
render(createElement) {
|
||||||
|
|
Loading…
Reference in New Issue