报名工具小程序初始代码

components/EditText/EditText.vue

@@ -0,0 +1,76 @@
+<template>
+	<view style="display: flex;flex-direction: row;align-items: center;height:100rpx;">
+
+		<input v-if="(inputType=='text')" type="text"
+			style="margin-right: 30rpx;flex: 1;padding-left: 36rpx;font-size: 30rpx;" :placeholder="hint"
+			@input="textChange" :value="value" :maxlength="maxlength"></input>
+		<input v-if="(inputType=='number')" type="number"
+			style="margin-right: 30rpx;flex: 1;padding-left: 36rpx;font-size: 30rpx;" :placeholder="hint"
+			@input="textChange" :value="value" :maxlength="maxlength"></input>
+		<input v-if="(inputType=='idcard')" type="idcard"
+			style="margin-right: 30rpx;flex: 1;padding-left: 36rpx;font-size: 30rpx;" :placeholder="hint"
+			@input="textChange" :value="value" :maxlength="maxlength"></input>
+		<input v-if="(inputType=='digit')" type="digit"
+			style="margin-right: 30rpx;flex: 1;padding-left: 36rpx;font-size: 30rpx;" :placeholder="hint"
+			@input="textChange" :value="value" :maxlength="maxlength"></input>
+		<image v-if="isShowDelete" style="width: 50rpx;height: 50rpx;margin-right: 20rpx;flex-shrink: 0;"
+			src="../../static/img/public/shanchu1.png" mode="aspectFill" @click="clickRight()">
+		</image>
+	</view>
+</template>
+
+<script>
+	export default {
+		props: {
+			hint: {
+				type: String,
+				default: ""
+			},
+			text: {
+				type: String,
+				default: ""
+			},
+			inputType: {
+				type: String,
+				default: "text"
+			},
+			maxlength: {
+				type: Number,
+				default: 99999999
+			},
+
+		},
+		watch: {
+			text: {
+				handler(t, oldT) {
+					this.value = t
+					this.$emit("onTextChange", this.value)
+					this.isShowDelete = !this.IsEmpty(this.value)
+				},
+				immediate: true,
+			}
+		},
+		data() {
+			return {
+				isShowDelete: false,
+				value: ""
+			};
+		},
+		methods: {
+			textChange(e) {
+				this.isShowDelete = !this.IsEmpty(e.detail.value)
+				this.$emit("onTextChange", e.detail.value)
+				this.value = e.detail.value
+			},
+			clickRight() {
+				this.value = ""
+				this.$emit("onTextChange", this.value)
+				this.isShowDelete = !this.IsEmpty(this.value)
+			}
+		}
+	}
+</script>
+
+<style>
+
+</style>