Size: a a a

React: русскоязычное сообщество

2020 February 05

C

Coldseattle in React: русскоязычное сообщество
как пишешь
источник

C

Coldseattle in React: русскоязычное сообщество
через src={}
источник

T

The Fallen Phoenix in React: русскоязычное сообщество
const { images = [], current = 0 } = this.state;
if (!images.length) return null;
const src = images[current % images.length];
return <img src={src}/>
источник

T

The Fallen Phoenix in React: русскоязычное сообщество
Это если нужно показать только одну
источник

T

The Fallen Phoenix in React: русскоязычное сообщество
Также желательно добавить в состояние current явно
источник

T

The Fallen Phoenix in React: русскоязычное сообщество
В конструкторе
источник

T

The Fallen Phoenix in React: русскоязычное сообщество
A count убрать, потому что он всегда доступен как images.length
источник

T

The Fallen Phoenix in React: русскоязычное сообщество
Чтобы была возможность бегать по картинкам туда сюда, дописать в конструктор методы хендлеры
источник

C

Coldseattle in React: русскоязычное сообщество
Failed to compile
./src/components/ImageSlider.jsx
 Line 21:72:  Parsing error: Unexpected token, expected ","

 19 |         return (
 20 |             <div>
> 21 |                 { images.map((src, i) => <img src={src} key={src+i} /> }  
    |                                                                        ^
 22 |             </div>
 23 |         )
 24 |     }
источник

T

The Fallen Phoenix in React: русскоязычное сообщество
this.handleNext = () => this.setState(state => ({ ...state, current: state.current+1 }))
источник

T

The Fallen Phoenix in React: русскоязычное сообщество
Coldseattle
Failed to compile
./src/components/ImageSlider.jsx
 Line 21:72:  Parsing error: Unexpected token, expected ","

 19 |         return (
 20 |             <div>
> 21 |                 { images.map((src, i) => <img src={src} key={src+i} /> }  
    |                                                                        ^
 22 |             </div>
 23 |         )
 24 |     }
Скриншот кода в студию
источник

T

The Fallen Phoenix in React: русскоязычное сообщество
Скобки потеряны
источник

T

The Fallen Phoenix in React: русскоязычное сообщество
Так уже нашел
источник

C

Coldseattle in React: русскоязычное сообщество
import React from 'react'

class ImageSlider extends React.Component {
   constructor(props) {
       super(props);
       this.state = {
           current: 0,
           images : [
               '../img/ImageFirst.jpg',
               '../img/ImageSecond.jpg',
               '../img/ImageThree.jpg',
           ]
   }
}



   render() {
       return (
           <div>
               { images.map((src, i) => <img src={src} key={src+i} /> }  
           </div>
       )
   }

}

export default ImageSlider
источник

T

The Fallen Phoenix in React: русскоязычное сообщество
Coldseattle
import React from 'react'

class ImageSlider extends React.Component {
   constructor(props) {
       super(props);
       this.state = {
           current: 0,
           images : [
               '../img/ImageFirst.jpg',
               '../img/ImageSecond.jpg',
               '../img/ImageThree.jpg',
           ]
   }
}



   render() {
       return (
           <div>
               { images.map((src, i) => <img src={src} key={src+i} /> }  
           </div>
       )
   }

}

export default ImageSlider
Это не скриншот. Это неудобно читать и оно засоряет куда больше чат чем скриншот
источник

C

Coldseattle in React: русскоязычное сообщество
The Fallen Phoenix
Скобки потеряны
где
источник

T

The Fallen Phoenix in React: русскоязычное сообщество
После />
источник

C

Coldseattle in React: русскоязычное сообщество
источник

C

Coldseattle in React: русскоязычное сообщество
The Fallen Phoenix
После />
сделал
источник

T

The Fallen Phoenix in React: русскоязычное сообщество
Даже IDE показывает ошибку
источник