Tutoriel par Examples: accessoires



Les accessoires permettent de transférer des données d'un composant parent à un composant enfant. Les accessoires sont en lecture seule. Le composant enfant peut uniquement obtenir les propriétés transmises par le parent en utilisant this.props.keyName . En utilisant des accessoires, on peut re...
Une fois l'installation terminée. Copiez le code ci-dessous dans index.android.js ou dans le fichier index.ios.js pour utiliser les accessoires. import React, { Component } from 'react'; import { AppRegistry, Text, View } from 'react-native'; class Greeting extends Component { render() {...
Les accessoires sont un moyen de transmettre des informations dans un composant React, ils peuvent avoir n'importe quel type, y compris des fonctions - parfois appelés rappels. Dans JSX, les objets sont transmis avec la syntaxe d'attribut <MyComponent userID={123} /> Dans la défini...
defaultProps vous permet de définir des valeurs par défaut ou de secours pour vos props composant. defaultProps est utile lorsque vous appelez des composants de différentes vues avec des objets fixes, mais dans certaines vues, vous devez transmettre des valeurs différentes. Syntaxe ES5 var MyClas...
use-fixtures permet d'emballer chaque deftest dans l'espace de nommage avec le code qui s'exécute avant et après le test. Il peut être utilisé pour des luminaires ou des bouts. Les appareils ne sont que des fonctions qui prennent en charge la fonction de test et l’exécutent avec d’autr...
Dans Vue.js, chaque instance de composant a sa propre étendue isolée , ce qui signifie que si un composant parent a un composant enfant, le composant enfant a sa propre étendue isolée et le composant parent a sa propre étendue isolée. Pour toute application de taille moyenne à grande, le respect d...
Tout comme vous pouvez lier des données d'une vue au modèle, vous pouvez également lier des éléments à l'aide de la même directive v-bind pour transmettre des informations des composants parent à enfant. JS new Vue({ el: '#example', data: { msg: 'hello world' } });...
Au lieu de var component = <Component foo={this.props.x} bar={this.props.y} />; Lorsque chaque propriété doit être transmise en tant que valeur unique, vous pouvez utiliser l'opérateur de propagation ... pris en charge pour les baies dans ES6 afin de transmettre toutes vos valeurs. Le c...
defaultProps vous permet de définir des valeurs par défaut pour votre composant. Dans l'exemple ci-dessous si vous ne passez pas le nom props, il affichera John sinon il affichera la valeur passée class Example extends Component { render() { return ( <View> <Tex...
Nous avons un composant parent: Importer un composant enfant dans ce composant, nous passerons des accessoires via un attribut. Ici, l'attribut est "src" et nous passons aussi le "src". ParentComponent.js import ChildComponent from './ChildComponent'; export default { ...
Il y a des changements importants dans la façon dont nous utilisons et déclarons les accessoires par défaut et leurs types. React.createClass Dans cette version, la propriété propTypes est un objet dans lequel nous pouvons déclarer le type de chaque accessoire. La propriété getDefaultProps est un...
Il existe plusieurs façons de spécifier des accessoires dans JSX. Expressions JavaScript Vous pouvez transmettre n'importe quelle expression JavaScript en prop, en l'entourant de {} . Par exemple, dans cette JSX: <MyComponent count={1 + 2 + 3 + 4} /> Dans le MyComponent , la valeu...
class Hello < Hyperloop::Component # params (= react props) are declared using the param macro param :guest render do "Hello there #{params.guest}" end end # to "mount" Hello with guest = "Matz" say Hello(guest: 'Matz') # params can be giv...
JavaScript: Vue.component('props-component', { template: '#props-component-template', // array of all props props: ['myprop', 'calcprop'] }); new Vue({ el: '#app' }); HTML: <div id="app"> <template id="props-component-template"> ...

Page 1 de 1