Thursday, 8 November 2018

changing style of a div in reactjs picking a random color from a array

changing style of a div in reactjs picking a random color from a array
running code->https://stackblitz.com/edit/react-62igcp
code:->
import React, { Component } from 'react';
import { render } from 'react-dom';
import './style.css';

class App extends Component {
constructor() {
super();
this.state = {
color: 'blue'
};
}
getRandomColor()
{

var colorArray=[
"blue","red","grreen","pink","yellow","orange","DodgerBlue","Tomato"
];
var index=Math.round(Math.random()*(colorArray.length-1));
const newColor= colorArray[index];
this.setState({color:newColor});
}
render() {
return (
<div style={{background: this.state.color}}>
<div ></div>
<div>click on button to change background color</div>
<span><button onClick={()=>{
this.getRandomColor();
}}>Click on button to change color</button></span>
</div>
);
}
}

render(<App />, document.getElementById('root'));

No comments:

Post a Comment

understanding promise and async function using example

working link-> https://stackblitz.com/edit/js-it5ura?file=index.js //passing value to a promise using arrow function let numberS...