如何在React-ChartJS-2中动态更改选项？

Question

我的问题是我想动态更改Bar组件中的选项（我的XAxis显示类型更具体）（取决于参数）。我花了一整天的时间来解决这个问题，但是我陷入了困境。请看一下：

import React, { Component } from 'react';
import { Bar } from 'react-chartjs-2';
import './App.css'

const data = {
  labels: [1527372000000, 1527458400000, 1527544800000, 1527631200000, 1527717600000, 1527804000000, 1527890400000],
  datasets: [
    {
      label: 'My First dataset',
      backgroundColor: 'rgba(255,99,132,0.2)',
      borderColor: 'rgba(255,99,132,1)',
      borderWidth: 1,
      hoverBackgroundColor: 'rgba(255,99,132,0.4)',
      hoverBorderColor: 'rgba(255,99,132,1)',
      data: [65, 59, 80, 81, 56, 55, 40]
    }
  ]
};

class App extends Component {
  render() {
    let xtype;

    if(true) { 
      xtype = 'time'
    }

    return (
      <div className='bar'>
        <Bar
          data={data}
          options={{
            maintainAspectRatio: false,
            responsive: true,
            scales: {
              xAxes: [{
                type: {xtype}, // i want this value to change to 'time' if condition is true
                distribution: 'series'
              }],
              yAxes: [{
                ticks: {
                  beginAtZero: true
                }
              }]
            }
          }}
        />
      </div>
    );
  }
}

export default App;

谢谢您的帮助！