0){self.limitArea=1...}" ."/> 0){self.limitArea=1...}" .">
Maison >interface Web >uni-app >Comment changer l'état sélectionné de la case à cocher dans Uniapp
Comment uniapp modifie l'état sélectionné de la case à cocher : ouvrez d'abord le fichier de code correspondant puis ajoutez le code "if(e.detail.value.length>0){self.limitArea=1...}" Juste modifier le statut sélectionné.
L'environnement d'exploitation de cet article : système Windows7, version uni-app2.5.1, ordinateur DELL G3.
Enregistrez une case à cocher uniapp et comment modifier dynamiquement l'état de la vérification
Scénario : lorsque l'utilisateur clique sur la case à cocher dans l'état non coché, une confirmation et une annulation apparaîtront Cliquez sur OK. Il est coché par défaut. Cliquez sur Annuler pour revenir à l'état non coché.
Faites habituellement ceci :
<checkbox-group @change="checkboxChange" name="limitarea" > <label> <checkbox value="1" :checked="limitArea"/> <text>限定地区</text> </label> </checkbox-group> <script> export default { data() { return { limitArea:0 } }, methods: { checkboxChange: function(e){ var self = this; if( e.detail.value.length > 0 ){ uni.showModal({ title: '限定地区', content: '限定地区,可能需要等待较长时间', confirmText: "确定", cancelText: "取消", success: function (res) { if (res.confirm) { self.limitArea = 1; }else{ self.limitArea = 0; } } }); }else{ this.limitArea = 0; } } }, components: {} } </script>
:checked="limitArea" ci-dessus, l'état d'affichage est lié à limitArea. Cependant, j'ai constaté que même si j'avais cliqué sur Annuler, la valeur limitArea était passée à 0. Logiquement parlant, la case à cocher devrait être décochée, mais l'état coché affiché est toujours coché. Je ne comprends pas la raison. Solution :
checkboxChange: function(e){ var self = this; if( e.detail.value.length > 0 ){//点击勾选 self.limitArea = 1; // *****加上这句代码******* uni.showModal({ title: '限定地区', content: '限定地区,可能需要等待较长时间', confirmText: "确定", cancelText: "取消", success: function (res) { if (res.confirm) { self.limitArea = 1; }else{ self.limitArea = 0; } } }); }else{ this.limitArea = 0; } }
Scénario 2 :
Cliquez pour vérifier, mais nous ne voulons pas le vérifier et le forcer à revenir à l'état non coché. La modification directe de la valeur limitArea ne prendra pas effet. La solution : une invite apparaîtra, cliquez sur OK, puis modifiez la valeur dans OK, mais vous devez toujours faire attention au problème du premier scénario.
Recommandé : "Tutoriel Uniapp"
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!