|
- <template>
- <view class="cu-form-group">
- <view class="title">
- <text v-if="required" class="lr-required">*</text>
- <slot name="title">{{ title }}</slot>
- </view>
- <input
- @input="input"
- @blur="blur"
- :value="value"
- :type="type"
- :disabled="disabled"
- :password="password"
- :maxlength="maxlength"
- :placeholder="displayPlaceholder"
- :style="{ textAlign: left ? 'left' : 'right' }"
- />
- <slot name="suffix"></slot>
- </view>
- </template>
-
- <script>
- export default {
- name: 'l-input',
-
- props: {
- type: { default: 'text' },
- title: {},
- placeholder: {},
- maxlength: { default: -1 },
- disabled: {},
- password: {},
- left: {},
- value: {},
- required: {}
- },
-
- methods: {
- input(e) {
- this.$emit('input', e.detail.value)
- this.$emit('change', e.detail.value)
- },
- blur(e){
- this.$emit('blur', e.detail.value)
- }
- },
-
- computed: {
- displayPlaceholder() {
- if (this.disabled) {
- return ''
- }
-
- if (this.placeholder) {
- return this.placeholder
- }
-
- return this.title ? `请输入${this.title}` : `请输入…`
- }
- }
- }
- </script>
|
