Maison > interface Web > js tutoriel > Sélection du formulaire d'action ReactJS

Sélection du formulaire d'action ReactJS

php中世界最好的语言
Libérer: 2018-04-17 16:00:05
original
1730 Les gens l'ont consulté

Cette fois, je vais vous présenter la sélection du formulaire d'opération ReactJS. Quelles sont les précautions pour la sélection du formulaire d'opération ReactJS. Voici un cas pratique, jetons un coup d'oeil.

L'exigence est de mettre en œuvre la sélection unique, la sélection inverse, la sélection multiple et d'effacer toutes les opérations sur la liste

...... 
 this.state = {
   //初始化空数组,表示已经选择的
   selectedStores:[],
  }
......
handleClick(e){
 const newSelection = e.target.value;//拿到点击的具体一项
 let newSelectionArray;//新建一个空数组
//判断点击项是否为选择状态,是的话清除选中状态
 if(this.state.selectedStores.indexOf(newSelection) > -1) {
  newSelectionArray =
  this.state.selectedStores.filter((s:any) => s !== newSelection)
} else {
//不是的话就加入新选择数组
  newSelectionArray =
  [...this.state.selectedStores, newSelection];
}
 this.setState({
// 新选择数组统一改为选中状态
  selectedStores: newSelectionArray
 });
}
Copier après la connexion

La méthode Array.prototype.indexOf() renvoie le premier index où un élément donné peut être trouvé dans le tableau, ou -1 s'il n'existe pas.

Grammaire :

arr.indexOf(searchElement)
arr.indexOf(searchElement[, fromIndex = 0])
Copier après la connexion

La méthode Array.prototype.filter() crée un nouveau tableau contenant tous les éléments du test implémenté par la fonction fournie.

Grammaire :

var new_array = arr.filter(callback[, thisArg])
Copier après la connexion

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web PHP chinois !

Lecture recommandée :

Utilisation de minuteries avec AngualrJs

axios gère l'envoi http de Post et get

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal