[fix] 修复input 为选择框时没有提示问题

This commit is contained in:
aisen
2025-12-01 14:41:53 +08:00
parent 9c161727ff
commit 5b1e863066
+34 -23
View File
@@ -45,7 +45,7 @@
v-if="type === 'select'"
class="tn-input__text"
>
{{defaultValue == undefined || defaultValue == '' ? placeholder : defaultValue }}
<text :class="defaultValue == undefined || defaultValue == '' ? 'tn-input__placeholder':''">{{defaultValue == undefined || defaultValue == '' ? placeholder : defaultValue }}</text>
</view>
<input
@@ -337,28 +337,7 @@
/**
* input事件
*/
handleInput:debounceFun(function(event){
let value = event.detail.value
// 是否需要去掉空格
if (this.trim) value = this.$tn.string.trim(value)
// 原生事件
this.$emit('input', value)
// model赋值
this.defaultValue = value
// 过一个生命周期再发送事件给tn-form-item,否则this.$emit('input')更新了父组件的值,但是微信小程序上
// 尚未更新到tn-form-item,导致获取的值为空,从而校验混论
// 这里不能延时时间太短,或者使用this.$nextTick,否则在头条上,会造成混乱
setTimeout(() => {
// 头条小程序由于自身bug,导致中文下,每按下一个键(尚未完成输入),都会触发一次@input,导致错误,这里进行判断处理
// #ifdef MP-TOUTIAO
if (this.$tn.string.trim(value) === this.lastValue) return
this.lastValue = value
// #endif
// 发送当前的值到form-item进行校验
this.dispatch('tn-form-item','on-form-change', value)
}, 40)
},this.blockTime),
handleInput:()=>{},
/**
* blur事件
*/
@@ -407,7 +386,35 @@
inputClick() {
this.$emit('click')
}
},
mounted() {
let that = this;
that.handleInput = debounceFun(function(event){
let value = event.detail.value
// 是否需要去掉空格
try {
if (that.trim) value = that.$tn.string.trim(value)
}catch (e){
}
// 原生事件
that.$emit('input', value)
// model赋值
that.defaultValue = value
// 过一个生命周期再发送事件给tn-form-item,否则this.$emit('input')更新了父组件的值,但是微信小程序上
// 尚未更新到tn-form-item,导致获取的值为空,从而校验混论
// 这里不能延时时间太短,或者使用this.$nextTick,否则在头条上,会造成混乱
setTimeout(() => {
// 头条小程序由于自身bug,导致中文下,每按下一个键(尚未完成输入),都会触发一次@input,导致错误,这里进行判断处理
// #ifdef MP-TOUTIAO
if (that.$tn.string.trim(value) === that.lastValue) return
that.lastValue = value
// #endif
// 发送当前的值到form-item进行校验
that.dispatch('tn-form-item','on-form-change', value)
}, 40)
},that.blockTime);
},
}
</script>
@@ -418,6 +425,10 @@
position: relative;
flex: 1;
&__placeholder{
color: $tn-font-sub-color;
}
&__input {
font-size: 28rpx;
color: $tn-font-color;