javascript - Problèmes de positionnement des entrées dans le front-end js de l'applet WeChat

Question

1. J'ai écrit une applet WeChat, un jeu de Sudoku, pour déterminer s'il répond aux exigences (règles du Sudoku) en fonction du numéro saisi. Cependant, j'ai rencontré un problème, comment trouver la position du numéro saisi par l'utilisateur, car il doit être déplacé en fonction de la position. Les données sont transmises dans le fichier de script correspondant pour déterminer si les règles sont respectées, mais comme je ne maîtrise pas très bien js, je ne peux pas résoudre le problème de positionnement.

1. <view class="page-body">

   <view class="bc" wx:for="{{numbers}}" wx:for-item="row" >
       <view wx:for="{{row}}" class="bc_ bc_{{item}}" bindtap="oninput"> 
         <input wx:if="{{item == 0}}" auto-focus wxkey="*this" maxlength="1" value="" onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')" type="number" style="color:#000000" bindinput="EventHandle"/>
         <view wx:else>{{item}}</view>
       </view>
   </view>

   </vue>

Où les nombres sont un tableau dans le fichier de script et le style est implémenté à l'aide de deux boucles.
Il déterminera si chaque nombre est nul (le tableau que nous avons écrit manuellement au début, 0 représente la saisie de l'utilisateur). S'il est nul, aucun caractère (chaîne) ne sera affiché ici.

Voici le code d'affichage frontal et l'effet d'affichage. L'espace vide permet aux utilisateurs de remplir des chiffres, mais je ne sais pas comment trouver où l'utilisateur a entré les chiffres. moi.

Answer 1

Laissez-moi vous parler de mes idées, à titre indicatif seulement :
Chaque petit carré est un objet, avec les attributs x et y, représentant le y-ième carré de la x-ième rangée, à travers la taille du boîte p externe, calculez la taille de chaque petit carré, puis vous pourrez connaître la plage de superficie de chaque petit carré. Lorsque l'utilisateur clique, obtenez les coordonnées du point de clic et calculez dans quel petit carré il se situe.
Bref c'est un problème de calcul mathématique

Answer 2

Idée :
Chaque carré a les attributs data-x='??' et data-y='??' Lorsque l'utilisateur clique, il peut obtenir x et y, puis effectuer des calculs et des jugements ultérieurs.

Answer 3

L'objet événement dans l'applet WeChat est traité et contient l'attribut value de l'entrée.
WeChat Mini Programme - Événement

Laissez-moi vous expliquer mes pensées en détail :
L'événement de l'applet WeChat peut stocker des données supplémentaires définies par l'élément. Par exemple, si vous écrivez l'attribut data-x dans le dom, vous pouvez l'utiliser. event.target. Retirez dataset.x.
S'il s'agit d'un élément de formulaire, tel que la valeur d'entrée, il est stocké dans event.detail.value.
Vous pouvez écouter un événement pour l'entrée, puis écrire les attributs de data-x et data-y dans l'élément. La valeur de l'attribut est l'indice des nombres et de la ligne (c'est-à-dire l'index. To). évitez toute confusion, utilisez wx : for-index="XXX" donne deux alias d'indice), déterminez la position du clic de l'utilisateur via la valeur d'indice, puis stockez-la dans la position correspondante du tableau.

array[x][y].push(event.detail.value)