El problema de que el enlace bidireccional de entrada de uniapp no puede obtener el valor en el lado de la aplicación
En uniapp, use el modelo v de entrada para el enlace de datos. Cuando no se determina el método de entrada, el cuadro de entrada muestra un valor, pero la variable enlazada dinámicamente no puede obtener el valor correspondiente. En este momento, si desea enviar datos o algo, encontrará que siempre está vacío
En el caso de la imagen de arriba, el usuario no eligió el inglés correspondiente, si presiona guardar directamente, encontrará que no puede obtener los datos, pero la página muestra los datos (existentes en algunos teléfonos móviles e iOS)
La solución a este problema es agregar un temporizador al disparador del método de guardar y perder el foco
1. El primer paso es establecer dinámicamente el atributo fcous en la entrada
2. Quite el foco al hacer clic en guardar y agregue un temporizador
El código completo contiene mis propios componentes empaquetados, por lo que no puedo usar directamente los componentes de la plantilla, solo elimino la entrada.
<template>
<view class="content">
<c-label label="input输入的值">
<text>{
{val}}</text>
</c-label>
<c-label label="input">
<input type="text" value="" v-model="val" :focus="isFocus" placeholder="请输入"/>
</c-label>
<view class="m30">
<c-button type="default" round="" @click="save">确定</c-button>
</view>
</view>
</template>
<script>
export default {
data() {
return {
val : '',
isFocus : false,
timer : null,
};
},
async onLoad() {
},
methods: {
save(){
/* 取消焦点 */
this.isFocus = false;
/* 添加定时器 */
clearTimeout(this.timer);
this.timer = setTimeout(()=>{
// 逻辑操作
},300)
}
},
async onShow() {
const that = this;
/* 登录操作处理 */
// this.$store.dispatch('login/checkLogin')
},
async onReady() {
}
};
</script>
<style lang="scss">
</style>