You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
77 lines
2.0 KiB
77 lines
2.0 KiB
1 year ago
|
<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>
|