Pytania otagowane jako react-jsx

React to biblioteka JavaScript do tworzenia interfejsów użytkownika. Wykorzystuje deklaratywny paradygmat oparty na komponentach i ma być zarówno wydajny, jak i elastyczny.

24
Jak przekazać rekwizyty do {this.props.children}
Próbuję znaleźć właściwy sposób zdefiniowania niektórych składników, które mogłyby być używane w ogólny sposób: <Parent> <Child value="1"> <Child value="2"> </Parent> Istnieje oczywiście logika renderowania między komponentami nadrzędnymi i podrzędnymi, co można sobie wyobrazić <select>i <option>jako przykład tej logiki. To jest fikcyjna implementacja na potrzeby pytania: var Parent = React.createClass({ doSomething: …

19
Czy możesz wymusić ponowne wysłanie komponentu React bez wywoływania setState?
Mam zewnętrzny (do komponentu), obserwowalny obiekt, na którym chcę nasłuchiwać zmian. Gdy obiekt jest aktualizowany, emituje zdarzenia zmiany, a następnie chcę ponownie wysłać komponent po wykryciu jakiejkolwiek zmiany. W przypadku najwyższego poziomu React.renderbyło to możliwe, ale w komponencie nie działa (co ma sens, ponieważ rendermetoda zwraca obiekt). Oto przykład kodu: …
690 reactjs  react-jsx 

19
Najlepsze praktyki w stylu Inact.js
Wiem, że możesz określić style w klasach React, takie jak to: var MyDiv = React.createClass({ render: function() { var style = { color: 'white', fontSize: 200 }; return <div style={style}> Have a good and productive day! </div>; } }); Czy powinienem dążyć do stylizacji w ten sposób i nie mieć …

6
Dlaczego wywoływanie metody reagowania setState nie powoduje natychmiastowej mutacji stanu?
Czytam sekcję FormularzeReagujedokumentacja i właśnie wypróbowałem ten kod, aby zademonstrować onChangeużycie ( JSBIN ). var React= require('react'); var ControlledForm= React.createClass({ getInitialState: function() { return { value: "initial value" }; }, handleChange: function(event) { console.log(this.state.value); this.setState({value: event.target.value}); console.log(this.state.value); }, render: function() { return ( <input type="text" value={this.state.value} onChange={this.handleChange}/> ); } }); …

16
Dodanie znacznika skryptu do React / JSX
Mam stosunkowo prosty problem z dodaniem wbudowanego skryptu do komponentu React. Co mam do tej pory: 'use strict'; import '../../styles/pages/people.scss'; import React, { Component } from 'react'; import DocumentTitle from 'react-document-title'; import { prefix } from '../../core/util'; export default class extends Component { render() { return ( <DocumentTitle title="People"> <article …


8
Wstaw HTML za pomocą instrukcji React Variable (JSX)
Tworzę coś z React, gdzie muszę wstawić HTML z React Variables w JSX. Czy istnieje sposób na taką zmienną: var thisIsMyCopy = '<p>copy copy copy <strong>strong copy</strong></p>'; i wstawić go w taki sposób, żeby działał? render: function() { return ( <div className="content">{thisIsMyCopy}</div> ); } i czy wstawia HTML zgodnie z …

12
Nazwa komponentu dynamicznego React / JSX
Staram się dynamicznie renderować komponenty na podstawie ich typu. Na przykład: var type = "Example"; var ComponentName = type + "Component"; return <ComponentName />; // Returns <examplecomponent /> instead of <ExampleComponent /> Wypróbowałem rozwiązanie zaproponowane tutaj Dynamiczne nazwy komponentów React / JSX To dało mi błąd podczas kompilacji (używając browserify …


6
Ostrzeżenie: nieznana klasa właściwości DOM. Czy chodziło Ci o className?
Właśnie zacząłem poznawać Reacta, dodając komponent z prostą funkcją renderującą: render() { return <div class="myApp"></div> } Po uruchomieniu aplikacji pojawia się następujący błąd: Warning: Unknown DOM property class. Did you mean className? Mogę to rozwiązać, zmieniając class na className. Pytanie brzmi; czy React egzekwuje tę konwencję? Dlaczego muszę używać classNamezamiast …

9
ReactJS: „Uncaught SyntaxError: Nieoczekiwany token <”
Próbuję zacząć budować witrynę w ReactJS. Jednak kiedy próbowałem umieścić mój JS w oddzielnym pliku, zacząłem otrzymywać ten błąd: „Uncaught SyntaxError: Uknown token &lt;”. Próbowałem dodać /** @jsx React.DOM */na początku pliku JS, ale to niczego nie naprawiło. Poniżej znajdują się pliki HTML i JS. Jakieś pomysły, co się dzieje? …

7
Reaguj na plik JSX podając błąd „Nie można odczytać właściwości„ createElement ”o wartości undefined”
Mam plik test_stuff.js, z którym pracuję npm test Wygląda to mniej więcej tak: import { assert } from 'assert'; import { MyProvider } from '../src/index'; import { React } from 'react'; const myProvider = ( &lt;MyProvider&gt; &lt;/MyProvider&gt; ); describe('Array', function() { describe('#indexOf()', function() { it('should return -1 when the value …


9
Najlepsza praktyka podczas dodawania białych znaków w JSX
Rozumiem, jak (i dlaczego ) dodać spacje w JSX, ale zastanawiam się, jaka jest najlepsza praktyka lub czy coś robi jakąkolwiek różnicę? Owiń oba elementy w rozpiętość &lt;div className="top-element-formatting"&gt; &lt;span&gt;Hello &lt;/span&gt; &lt;span className="second-word-formatting"&gt;World!&lt;/span&gt; &lt;/div&gt; Dodaj je w jednej linii &lt;div className="top-element-formatting"&gt; Hello &lt;span className="second-word-formatting"&gt;World!&lt;/span&gt; &lt;/div&gt; Dodaj przestrzeń za pomocą JS …

6
Odsłuchaj naciśnięcie klawisza dokumentu w Reactjs
Chcę powiązać, aby zamknąć aktywne okno wyskakujące bootstrap reagowania na escapeprasie. Oto kod _handleEscKey:function(event){ console.log(event); if(event.keyCode == 27){ this.state.activePopover.hide(); } }, componentWillMount:function(){ BannerDataStore.addChangeListener(this._onchange); document.addEventListener("click", this._handleDocumentClick, false); document.addEventListener("keyPress", this._handleEscKey, false); }, componentWillUnmount: function() { BannerDataStore.removeChangeListener(this._onchange); document.removeEventListener("click", this._handleDocumentClick, false); document.removeEventListener("keyPress", this._handleEscKey, false); }, Ale nic się nie loguje w konsoli po naciśnięciu …
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.