assess-app/components/en-from/en-input/index.vue

<template>
	<view class="en-box">
		<input class="en-input sys-size-32 text-color-12 sys-weight-600"
			placeholder-class="sys-size-28 text-color-999 sys-weight-400" :maxlength="maxlength" :type="type"
			:focus="focus" :placeholder="placeholder ? placeholder : ''" :disabled="!!disabled" v-model="inputValue"
			@blur="nameInput" @input="nameInput"></input>
	</view>
</template>

<script>
	export default {
		name: 'en-input',
		props: {
			type: {
				type: String,
				default: 'text'
			},
			placeholder: {
				type: String,
				default: '请输入'
			},
			disabled: {
				default: false
			},
			name: {
				type: String,
				default: 'text'
			},
			value: {
				default: ''
			},
			maxlength: {
				default: 140
			},
			focus: {
				default: false
			}
		},
		data() {
			return {
				inputValue: '',
				showShake: false
			};
		},
		watch: {
			'value': function() {
				if (this.inputValue !== this.value) {
					this.inputValue = this.value
				}
			},
			'inputValue': function() {
				this.$emit('input', this.inputValue)
			}
		},
		mounted() {
			this.inputValue = this.value
		},
		methods: {
			nameInput(e) {
				if (this.type === 'nickname') {
					this.inputValue = e.detail.value
				}

			},
		}
	}
</script>

<style lang="scss">
	.en-input {
		.en-input {
			width: 100%;
		}

		.en-input-placeholder {
			color: #999999;
			font-size: 28rpx;
		}
	}
</style>