胜利——数据可视化

Question

我正在尝试将 Victory 用于我的 React 项目，但由于某种原因它无法正常工作。

我使用的代码是：

class App extends React.Component {

  constructor(props) {
    super(props);
    this.state = {
      data: this.getData()
    };
  }

  componentDidMount() {
    this.setStateInterval = window.setInterval(() => {
      this.setState({
        data: this.getData()
      });
    }, 3000);
  }

  componentWillUnmount() {
    window.clearInterval(this.setStateInterval);
  }

  getData() {
    const bars = random(6, 10);
    return range(bars).map((bar) => {
      return {x: bar + 1, y: random(2, 10)};
    });
  }

  render() {
    return (
      <VictoryChart
        domainPadding={{ x: 20 }}
        animate={{duration: 500}}
      >
        <VictoryBar
          data={this.state.data}
          style={{
            data: { fill: "tomato", width: 12 }
          }}
          animate={{
            onExit: {
              duration: 500,
              before: () => ({
                _y: 0,
                fill: "orange",
                label: "BYE"
              })
            }
          }}
        />
      </VictoryChart>
    );
  }
}

ReactDOM.render(<App/>, mountNode)

我在函数的不同部分使用了大多数组件。

我得到的错误是：

  Line 28:18:  'random' is not defined  no-undef
  Line 29:12:  'range' is not defined   no-undef
  Line 30:30:  'random' is not defined  no-undef

Search for the keywords to learn more about each error.

我刚刚添加了 Victory 组件，不知道要导入什么

Answer 1

这是您正在使用的替代功能，它不是有效的 javascript。你从哪里弄来的？

 const getData = () => {
   let arr = [];
  for (let i = 0; i < 15; i++) {
   arr.push({ x: x[i], y: y[Math.random(2, 10)] });
  }
  return arr;
 };