vue-material/src/components/mdInputContainer/mdTextarea.vue
2016-12-08 09:57:24 -02:00

53 lines
1.2 KiB
Vue

<template>
<textarea
class="md-input"
:value="value"
:disabled="disabled"
:required="required"
:placeholder="placeholder"
:maxlength="maxlength"
@focus="onFocus"
@blur="onBlur"
@input="onInput"></textarea>
</template>
<script>
import autosize from 'autosize';
import common from './common';
import getClosestVueParent from '../../core/utils/getClosestVueParent';
export default {
mixins: [common],
watch: {
value() {
this.$nextTick(() => {
autosize.update(this.$el);
});
}
},
mounted() {
this.parentContainer = getClosestVueParent(this.$parent, 'md-input-container');
if (!this.parentContainer) {
this.$destroy();
throw new Error('You should wrap the md-textarea in a md-input-container');
}
this.setParentDisabled();
this.setParentRequired();
this.setParentPlaceholder();
this.setParentValue();
this.handleMaxLength();
if (!this.$el.getAttribute('rows')) {
this.$el.setAttribute('rows', '1');
}
autosize(this.$el);
},
beforeDestroy() {
autosize.destroy(this.$el);
}
};
</script>