Le problème que la liaison bidirectionnelle d'entrée d'uniapp ne peut pas obtenir la valeur du côté APP
Dans uniapp, utilisez le modèle en V d'entrée pour la liaison de données. Lorsque la méthode d'entrée n'est pas déterminée, la zone de saisie affiche une valeur, mais la variable liée dynamiquement ne peut pas obtenir la valeur correspondante. À ce stade, si vous souhaitez soumettre des données ou quelque chose, vous constaterez qu'il est toujours vide
Dans le cas de l'image ci-dessus, l'utilisateur n'a pas choisi l'anglais correspondant. Si vous appuyez directement sur enregistrer, vous constaterez que vous ne pouvez pas obtenir les données, mais la page affiche les données (existant dans certains téléphones mobiles et iOS)
La solution à ce problème consiste à ajouter une minuterie au déclencheur de la méthode de sauvegarde et à perdre le focus
1. La première étape consiste à définir dynamiquement l'attribut fcous sur l'entrée
2. Supprimez le focus lorsque vous cliquez sur Enregistrer et ajoutez une minuterie
Le code complet contient mes propres composants packagés, donc je ne peux pas utiliser directement les composants du modèle, il suffit de retirer l'entrée.
<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>