Maison > interface Web > Questions et réponses frontales > Que représentent les trois points en réaction ?

Que représentent les trois points en réaction ?

藏色散人
Libérer: 2022-12-27 16:37:25
original
3417 Les gens l'ont consulté

Les trois points dans React représentent « l'opérateur d'extension » ; dans React, l'opérateur d'extension est généralement utilisé pour l'affectation par lots d'attributs, tels que « var props = {};props.foo = x;props.bar = y; var composant = ;".

Que représentent les trois points en réaction ?

L'environnement d'exploitation de ce tutoriel : système Windows 10, React version 18.0.0, ordinateur Dell G3.

Que représentent les trois points en réaction

représente "l'opérateur d'extension".

L'opérateur … (également appelé opérateur spread) est déjà pris en charge par les baies ES6. Il permet de transmettre des tableaux ou des fonctions de type tableau directement en tant que paramètres de fonctions sans passer par l'application.

var people=['Wayou','John','Sherlock'];
//sayHello函数本来接收三个单独的参数人一,人二和人三
function sayHello(people1,people2,people3){
    console.log(`Hello ${people1},${people2},${people3}`);
}
//但是我们将一个数组以拓展参数的形式传递,它能很好地映射到每个单独的参数
sayHello(...people);//输出:Hello Wayou,John,Sherlock 
//而在以前,如果需要传递数组当参数,我们需要使用函数的apply方法
sayHello.apply(null,people);//输出:Hello Wayou,John,Sherlock
Copier après la connexion

Dans React, l'opérateur spread est généralement utilisé pour l'attribution par lots d'attributs. Dans JSX, vous pouvez utiliser l'opérateur ... pour fusionner la paire clé-valeur d'un objet avec l'attribut props de ReactElement.

var props = {};
  props.foo = x;
  props.bar = y;
  var component = <Component {...props} />;
  
//等价于
var props = {};
  props.foo = x;
  props.bar = y;
  var component = <Component foo={x} bar={y} />;
Copier après la connexion

Il peut également être mélangé avec des attributs XML ordinaires. Il nécessite un attribut du même nom, et ce dernier remplacera le premier :

var props = { foo: &#39;default&#39; };
var component = <Component {...props} foo={&#39;override&#39;} />;
console.log(component.props.foo); // &#39;override&#39;
Copier après la connexion

Apprentissage recommandé : "tutoriel vidéo React"

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