jp-xpgj-GA-file/src/components/TextareaCheck.vue

<template>
	<div class="mui-input-row">
		<textarea v-model="newValue" rows="5" :max="max" :placeholder="placeholder"></textarea>
		<h6>{{strLength}}/{{max}}</h6>
	</div>
</template>

<script>
	export default {
		name: 'TextareaCheck',
		props: {
			value: {
				require: true,
				default: '',
			},
			max: {
				require: false,
				default: 1000,
			},
			placeholder: {
				require: false,
				default: '请输入详情',
			}
		},
		data() {
			return {
				strLength: 0,
			}
		},
		/* model: {
			prop: 'value',
		}, */
		computed: {
			newValue: {
				get: function() {
					return this.value;
				},
				set: function(value) {
					this.strLength = value.length
					this.$emit('input', value);
				}
			},
		},
		watch: {
			strLength() {
				if (this.strLength >= this.max) {
					this.newValue = String(this.newValue).slice(0, this.max);
				}
			}
		}
	}
</script>
<style scoped src="$project/assets/css/xpwyfyy.css"></style>

<style scoped>

</style>