Реагировать на собственный массив setState - PullRequest
0 голосов
/ 16 января 2019

Мне нужно изменить состояние элемента массива. Это изменение приводит к изменению цвета вида и изображения. Как я могу изменить состояние в реагировать на родной и загрузить изменения?

1 Ответ

0 голосов
/ 16 января 2019

Если вы меняете тему своего приложения (со статическими цветами и URL-адресами изображений), лучше обработать ее в css и сохранить название темы в состоянии, например:

class App extends React.Component {
  state = {
    theme: 'green-theme'
  }
  
  handleClick = () => {
    this.setState({ theme: 'red-theme' })
  }
  
  render(){
    const { theme } = this.state;
    return (
      <button className={theme} onClick={this.handleClick}>change theme</button>
    )
  }
}

ReactDOM.render(<App />, document.getElementById('root'))
.green-theme {
  background-color: lightgreen;
  /* background-image: url('path/to/img1'); */
}

.red-theme {
  background-color: lightcoral;
  /* background-image: url('path/to/img2'); */
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>
<div id="root"></div>
...