Pytania otagowane jako reactjs

React (znany również jako React.js lub ReactJS) to biblioteka JavaScript opracowana przez Facebooka w celu tworzenia interfejsów użytkownika. Wykorzystuje deklaratywny paradygmat oparty na komponentach, a jego celem jest zarówno wydajność, jak i elastyczność.

5
Dynamicznie importuj obrazy z katalogu za pomocą pakietu internetowego
Oto mój bieżący proces importowania obrazów i ikon w pakiecie internetowym za pośrednictwem ES6: import cat from './images/cat1.jpg' import cat2 from './images/cat2.svg' import doggy from './images/doggy.png' import turtle from './images/turtle.png' <img src={doggy} /> To szybko się brudzi. Oto, czego chcę: import * from './images' <img src={doggy} /> <img src={turtle} /> …
4
Dlaczego mój onClick jest wywoływany podczas renderowania? - React.js
Mam komponent, który stworzyłem: class Create extends Component { constructor(props) { super(props); } render() { var playlistDOM = this.renderPlaylists(this.props.playlists); return ( <div> {playlistDOM} </div> ) } activatePlaylist(playlistId) { debugger; } renderPlaylists(playlists) { return playlists.map(playlist => { return <div key={playlist.playlist_id} onClick={this.activatePlaylist(playlist.playlist_id)}>{playlist.playlist_name}</div> }); } } function mapStateToProps(state) { return { playlists: state.playlists …
11
Jak ręcznie wywołać zdarzenie kliknięcia w ReactJS?
Jak ręcznie wywołać zdarzenie kliknięcia w ReactJS ? Gdy użytkownik kliknie element1, chcę automatycznie wywołać kliknięcie inputtagu. <div className="div-margins logoContainer"> <div id="element1" className="content" onClick={this.uploadLogoIcon}> <div className="logoBlank" /> </div> <input accept="image/*" type="file" className="hide"/> </div>
106 html  reactjs 
5
Spraw, aby hak React useEffect nie działał przy początkowym renderowaniu
Według dokumentów: componentDidUpdate()jest wywoływana natychmiast po wystąpieniu aktualizacji. Ta metoda nie jest wywoływana przy pierwszym renderowaniu. Możemy użyć nowego useEffect()hooka do symulacji componentDidUpdate(), ale wygląda na to, że useEffect()jest uruchamiany po każdym renderowaniu, nawet za pierwszym razem. Jak sprawić, by nie działał przy początkowym renderowaniu? Jak widać w poniższym przykładzie, …
4
Jak stworzyć dynamiczny href w funkcji react render?
Renderuję listę postów. Dla każdego posta chciałbym wyrenderować tag kotwicy z identyfikatorem posta jako częścią ciągu href. render: function(){ return ( <ul> { this.props.posts.map(function(post){ return <li key={post.id}><a href='/posts/'{post.id}>{post.title}</a></li> }) } </ul> ); W jaki sposób mogę to zrobić tak, że każdy post ma href dnia /posts/1, /posts/2etc?
6
Dlaczego rekwizyty JSX nie powinny używać funkcji strzałek ani bindować?
Używam programu Lint z moją aplikacją React i otrzymuję ten błąd: error JSX props should not use arrow functions react/jsx-no-bind I tutaj uruchamiam funkcję strzałki (wewnątrz onClick): {this.state.photos.map(tile => ( <span key={tile.img}> <Checkbox defaultChecked={tile.checked} onCheck={() => this.selectPicture(tile)} style={{position: 'absolute', zIndex: 99, padding: 5, backgroundColor: 'rgba(255, 255, 255, 0.72)'}} /> <GridTile …
4
Renderowanie komponentów reagujących z tablicy obiektów
Mam pewne dane zwane stacjami, które są tablicą zawierającą obiekty. stations : [ {call:'station one',frequency:'000'}, {call:'station two',frequency:'001'} ] Chciałbym wyrenderować składnik interfejsu użytkownika dla każdej pozycji tablicy. Póki co mogę pisać var stationsArr = [] for (var i = 0; i < this.data.stations.length; i++) { stationsArr.push( <div className="station"> {this.data} </div> …
18
React.js - dane wejściowe tracą koncentrację podczas renderowania
Piszę tylko do wprowadzania tekstu i na onChangewypadek setState, gdyby zadzwoniłem , React ponownie renderuje mój interfejs użytkownika. Problem polega na tym, że wprowadzanie tekstu zawsze traci fokus, więc muszę go ponownie ustawić dla każdej litery: D. var EditorContainer = React.createClass({ componentDidMount: function () { $(this.getDOMNode()).slimScroll({height: this.props.height, distance: '4px', size: …
15
Jak dołączyć ikonę Font Awesome do renderowania Reacta ()
Ilekroć próbuję użyć ikony Font Awesome w React's render(), nie jest ona wyświetlana na wynikowej stronie internetowej, chociaż działa w normalnym HTML. render: function() { return <div><i class="fa fa-spinner fa-spin">no spinner but why</i></div>; } Oto przykład na żywo: http://jsfiddle.net/pLWS3/ Gdzie jest wina?
16
Ostrzeżenie: każde dziecko w tablicy lub iteratorze powinno mieć unikalną właściwość „klucz”. Sprawdź metodę renderowania „ListView”
Zbudowałem aplikację z ReactNative zarówno na iOS, jak i Androida z rozszerzeniemListView . Podczas wypełniania widoku listy prawidłowym źródłem danych na dole ekranu jest drukowane następujące ostrzeżenie: Ostrzeżenie: każde dziecko w tablicy lub iteratorze powinno mieć unikalną właściwość „key”. Sprawdź metodę renderowania ListView. Jaki jest cel tego ostrzeżenia? Po wiadomości …
4
Programy ładujące Webpack a wtyczki; co za różnica?
Jaka jest różnica między programami ładującymi a wtyczkami w pakiecie internetowym? Dokumentacja dla wtyczek tylko mówi: Użyj wtyczek, aby dodać funkcje zwykle związane z pakietami w pakiecie internetowym. Wiem, że babel używa programu ładującego do transformacji jsx / es2015, ale wygląda na to, że inne typowe zadania (na przykład wtyczka …
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.