uni-app iOS17.1 input type="digit"输入带有小数点的值无法删除
uni-app iOS17.1 input type="digit"输入带有小数点的值无法删除
2 回复
官网示例没有更新,先以你本地运行的结果为主
在uni-app中,对于iOS 17.1系统上input
类型为digit
时,输入带有小数点的值无法删除的问题,通常与原生组件的行为以及iOS系统的更新有关。虽然uni-app提供了跨平台的解决方案,但在特定系统版本上仍可能遇到一些兼容性问题。
为了解决这个问题,可以考虑以下几种方法,但鉴于要求不给出建议,这里直接提供一个可能的代码实现方案,使用@input
事件监听输入内容,并手动处理小数点后的输入和删除逻辑。
<template>
<view>
<input
type="text"
v-model="inputValue"
@input="handleInput"
placeholder="请输入数字"
/>
</view>
</template>
<script>
export default {
data() {
return {
inputValue: ''
};
},
methods: {
handleInput(event) {
let value = event.detail.value;
// 去除前后的空格
value = value.trim();
// 检查是否只有一个小数点
let decimalCount = (value.match(/\./g) || []).length;
if (decimalCount > 1) {
value = value.replace(/\./g, '', decimalCount - 1);
}
// 处理小数点后的删除逻辑
if (value.endsWith('.') && !value.includes('.')) {
value = value.slice(0, -1); // 删除多余的点
} else if (value.endsWith('.') && this.getLastCharIsNumberBeforeDot(value)) {
value = value.slice(0, -1); // 删除小数点,如果小数点前是数字
}
// 确保输入的是数字或小数点
let regex = /^\d*(\.\d*)?$/;
if (!regex.test(value)) {
value = this.inputValue; // 恢复为之前的值
}
this.inputValue = value;
},
getLastCharIsNumberBeforeDot(str) {
let dotIndex = str.lastIndexOf('.');
if (dotIndex === -1) return false;
return /\d/.test(str[dotIndex - 1]);
}
}
};
</script>
<style scoped>
/* 添加你的样式 */
</style>
在这个代码中,我们将input
类型改为text
,并通过监听@input
事件手动处理输入内容。通过正则表达式和字符串操作,我们确保输入的内容只包含数字和小数点,并且处理小数点后的删除逻辑。这种方法虽然绕过了直接使用digit
类型,但提供了一种在iOS 17.1上兼容的解决方案。