|
- <template>
- <view v-if="!simpleMode" :class="className" :style="style">
- <view class="cu-form-group" style="border-bottom: none; padding-bottom: 0;">
- <view class="title">
- <text v-if="required" style="color: red; font-size: 1.2em;">*</text>
- {{ title || '' }}
- </view>
- </view>
-
- <view class="cu-form-group" style="position: relative;border-top: none">
- <textarea
- @input="textareaInput"
- :maxlength="maxlength"
- :placeholder="displayPlaceHolder"
- :value="value"
- :auto-height="autoHeight"
- :disabled="readonly"
- :enableNative="false"
- style="margin-top: 0; border-top: none"
- controlled
- ></textarea>
- </view>
- </view>
-
- <view v-else :class="className" :style="style" class="cu-form-group" style="position: relative;">
- <textarea
- @input="textareaInput"
- :maxlength="maxlength"
- :placeholder="displayPlaceHolder"
- :fixed="fixed"
- :value="value"
- :style="textareaStyle"
- :auto-height="autoHeight"
- :disabled="readonly"
- :enableNative="false"
- controlled
- ></textarea>
- </view>
- </template>
-
- <script>
- export default {
- name: 'l-textarea',
-
- props: {
- maxlength: { default: -1 },
- readonly: {},
- placeholder: {},
- fixed: {},
- value: {},
- textareaStyle: {},
- autoHeight: {},
- simpleMode: {},
- required: {},
- title: {},
- disabled: {}
- },
-
- methods: {
- textareaInput(e) {
- this.$emit('change', e.detail.value)
- this.$emit('input', e.detail.value)
- }
- },
-
- computed: {
- displayPlaceHolder() {
- if (this.readonly) {
- return ''
- }
-
- if (this.placeholder) {
- return this.placeholder
- }
-
- return !this.simpleMode && this.title ? `请输入${this.title}` : '请输入…'
- }
- }
- }
- </script>
|
