Files
  • src
    • App.js
    • App.css
    • index.css
    • index.js
    • logo.svg
  • package.json
src/App.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';

class App extends Component {
  constructor(props){
    super(props);
    this.state={
      vector:[]
    }
  }
  render() {
    return (
      <div className="App">
        {<VectorSlider update={(val)=>this.updateVal(i,val)} value={this.state.vector[i]}/>}
      </div>
    );
  }
}
class VectorSlider extends Component{
  constructor(props){
    super(props);
    this.state={
      value:props.startingValue
    }
  }
  render(){
    return (
      <input type="range" id="range" min="-1" max="1" step="0.01" value={this.state.value} onChange={(evt)=>{this.props.update(evt.target.value);this.setState({value:evt.target.value})}} />
    )
  }
}

export default App;