2
0
mirror of https://github.com/tenrok/vue2-datepicker.git synced 2026-06-24 02:20:36 +03:00

fix: provide scoped slot to input slot (#492)

This commit is contained in:
mengxiong10
2020-08-09 20:23:51 +08:00
parent 1bca35bd74
commit b3126a0c65
+46 -13
View File
@@ -8,19 +8,47 @@
}" }"
> >
<div v-if="!inline" :class="`${prefixClass}-input-wrapper`" @mousedown="openPopup"> <div v-if="!inline" :class="`${prefixClass}-input-wrapper`" @mousedown="openPopup">
<slot name="input"> <slot
name="input"
:props="{
name: 'date',
type: 'text',
autocomplete: 'off',
value: text,
class: inputClass,
readonly: !editable,
disabled,
placeholder,
...inputAttr,
}"
:events="{
keydown: handleInputKeydown,
focus: handleInputFocus,
blur: handleInputBlur,
input: handleInputInput,
change: handleInputChange,
}"
>
<input <input
ref="input" ref="input"
v-bind="{ name: 'date', type: 'text', autocomplete: 'off', value: text, ...inputAttr }" v-bind="{
:class="inputClass" name: 'date',
:disabled="disabled" type: 'text',
:readonly="!editable" autocomplete: 'off',
:placeholder="placeholder" value: text,
@keydown="handleInputKeydown" class: inputClass,
@focus="handleInputFocus" readonly: !editable,
@blur="handleInputBlur" disabled,
@input="handleInputInput" placeholder,
@change="handleInputChange" ...inputAttr,
}"
v-on="{
keydown: handleInputKeydown,
focus: handleInputFocus,
blur: handleInputBlur,
input: handleInputInput,
change: handleInputChange,
}"
/> />
</slot> </slot>
<i v-if="showClearIcon" :class="`${prefixClass}-icon-clear`" @mousedown.stop="handleClear"> <i v-if="showClearIcon" :class="`${prefixClass}-icon-clear`" @mousedown.stop="handleClear">
@@ -456,10 +484,15 @@ export default {
this.$emit('update:open', false); this.$emit('update:open', false);
}, },
blur() { blur() {
this.$refs.input.blur(); // when use slot input
if (this.$refs.input) {
this.$refs.input.blur();
}
}, },
focus() { focus() {
this.$refs.input.focus(); if (this.$refs.input) {
this.$refs.input.focus();
}
}, },
handleInputChange() { handleInputChange() {
if (!this.editable || this.userInput === null) return; if (!this.editable || this.userInput === null) return;