Als «jsx» getaggte Fragen

Ich versuche, den richtigen Weg zu finden, um einige Komponenten zu definieren, die generisch verwendet werden könnten: <Parent> <Child value="1"> <Child value="2"> </Parent> Es gibt eine Logik für die Darstellung zwischen Eltern und Kindern Komponenten natürlich geht,...

Ich habe ein externes (für die Komponente) beobachtbares Objekt, auf das ich nach Änderungen warten möchte. Wenn das Objekt aktualisiert wird, werden Änderungsereignisse ausgegeben, und dann möchte ich die Komponente erneut rendern, wenn eine Änderung erkannt wird. Mit einer obersten Ebene war...

Mir ist bewusst, dass Sie Stile in React-Klassen wie folgt angeben können: var MyDiv = React.createClass({ render: function() { var style = { color: 'white', fontSize: 200 }; return <div style={style}> Have a good and productive day! </div>; } }); Sollte ich versuchen, alle Stile auf...

Ich lese den Abschnitt Formulare vonreagierenDokumentation und habe gerade diesen Code ausprobiert, um die onChangeVerwendung zu demonstrieren ( JSBIN ). var React= require('react'); var ControlledForm= React.createClass({ getInitialState: function() { return { value: "initial value" }; },...

Ich habe ein relativ einfaches Problem beim Versuch, einer React-Komponente Inline-Skripte hinzuzufügen. Was ich bisher habe: 'use strict'; import '../../styles/pages/people.scss'; import React, { Component } from 'react'; import DocumentTitle from 'react-document-title'; import { prefix } from...

Angesichts einer einfachen Komponente, die ihre Kinder rendert: class ContainerComponent extends Component { static propTypes = { children: PropTypes.object.isRequired, } render() { return ( <div> {this.props.children} </div> ); } } export default

Wie füge ich optional ein Element in JSX ein? Hier ist ein Beispiel für die Verwendung eines Banners, das sich in der Komponente befinden sollte, wenn es übergeben wurde. Ich möchte vermeiden, dass HTML-Tags in der if-Anweisung dupliziert werden müssen. render: function () { var banner; if...

Es gibt etwas, das ich bei der Arbeit sehr verwirrend finde React. Im Internet gibt es viele Beispiele, die .jsDateien mit Reaktion verwenden, aber viele andere verwenden .jsxDateien. Ich habe über .jsxDateien gelesen und mein Verständnis ist, dass Sie damit nur HTML-Tags in Ihre schreiben können...

Ich baue etwas mit React, wo ich HTML mit React Variables in JSX einfügen muss. Gibt es eine Möglichkeit, eine Variable wie diese zu haben: var thisIsMyCopy = '<p>copy copy copy <strong>strong copy</strong></p>'; und es einzufügen, um so zu reagieren, und hat es...

In den offiziellen Dokumenten von React wird erwähnt - Wenn Sie mit den Lebenszyklusmethoden der React-Klasse vertraut sind, können Sie sich useEffect Hook als die Komponenten componentDidMount, componentDidUpdate und componentWillUnmount vorstellen. Meine Frage ist - wie können wir die...

Ich versuche, Komponenten basierend auf ihrem Typ dynamisch zu rendern. Beispielsweise: var type = "Example"; var ComponentName = type + "Component"; return <ComponentName />; // Returns <examplecomponent /> instead of <ExampleComponent /> Ich habe die hier vorgeschlagene Lösung...

Ich versuche eine React-Komponente zu schreiben. für HTML-Überschriften-Tags (h1, h2, h3 usw.), bei denen sich die Überschriftenpriorität basierend auf der in den Requisiten definierten Priorität dynamisch ändert. Hier was ich versuche zu

Hier ist, was ich versucht habe und wie es schief geht. Das funktioniert: <div dangerouslySetInnerHTML={{ __html: "<h1>Hi there!</h1>" }} /> Das geht nicht: <div dangerouslySetInnerHTML={{ __html: this.props.match.description }} /> Die Beschreibungseigenschaft ist nur eine...

Ich habe mich ein bisschen nach einer Lösung für dieses Problem umgesehen. Alle schlagen vor "jsx": "react", Ihrer tsconfig.json-Datei etwas hinzuzufügen. Was ich getan habe. Ein anderer war hinzuzufügen "include: []", was ich auch getan habe. Ich erhalte jedoch immer noch den Fehler, wenn ich...

Ich versuche, eine jQuery-Komponente in React.js zu konvertieren, und eines der Dinge, mit denen ich Schwierigkeiten habe, ist das Rendern von n Elementen basierend auf einer for-Schleife. Ich verstehe, dass dies nicht möglich oder empfohlen ist und dass die Verwendung eines Arrays im Modell...

Neugierig, wie man das richtig angeht: var Hello = React.createClass({ getInitialState: function() { return {total: 0, input1:0, input2:0}; }, render: function() { return ( <div>{this.state.total}<br/> <input type="text" value={this.state.input1} onChange={this.handleChange} />...

Ich habe eine sehr einfache Funktionskomponente wie folgt: import * as React from 'react'; export interface AuxProps { children: React.ReactNode } const aux = (props: AuxProps) => props.children; export default aux; Und noch eine Komponente: import * as React from "react"; export interface...

Ich habe gerade angefangen, React zu untersuchen, indem ich eine Komponente mit einer einfachen Renderfunktion hinzugefügt habe: render() { return <div class="myApp"></div> } Wenn ich die App starte, wird folgende Fehlermeldung angezeigt: Warning: Unknown DOM property class. Did you...

Ich versuche, eine Site in ReactJS zu erstellen. Als ich jedoch versuchte, mein JS in eine separate Datei zu stellen, wurde der folgende Fehler angezeigt: "Nicht erfasster Syntaxfehler: Unerwartetes Token <". Ich habe versucht /** @jsx React.DOM */, oben in die JS-Datei einzufügen, aber es wurde...

Ich verwende mit meiner React-App Flusen und erhalte folgende Fehlermeldung: error JSX props should not use arrow functions react/jsx-no-bind Und hier führe ich die Pfeilfunktion (innen onClick) aus: {this.state.photos.map(tile => ( <span key={tile.img}> <Checkbox