0

Есть список с набором цветов (массив: red, blue и т.д.) и абзац, как сделать так, чтобы при выборе цвета фон менялся?

Если есть какая-то хорошая документация с примерами для начинающих, была бы благодарна за ссылку.

1 ответ 1

0

я вот на прошлой неделе прочитал введение в официальной документации и в целом там есть вся информация, чтобы реализовать вашу задачу.
Какую еще "хорошую" документацию вы хотите найти?

class Example extends React.Component {

    constructor(props){
        super(props);
               
        this.state = { color: this.props.colors[0] };
        
        this.changeColor = this.changeColor.bind(this);
    }
    
    changeColor(e){
      this.setState( { color: e.target.value });
    }
   
    render(){          
      return <div>
            <p style={{backgroundColor: this.state.color}}>sample text</p>
            <select onChange={this.changeColor}>
               {this.props.colors.map(c => (<option value={c}>{c}</option>))}
            </select>
            </div>
      }
            
}

ReactDOM.render(
    <Example colors={['red', 'green', 'blue']}/>,
    document.getElementById("ex")
  );
p {
 color: white;
 padding: 1rem;
}
<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="ex"></div>

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.