Exportation d'une classe en cours de réaction

Question

J'utilise le code standard d'un graphique à l'aide de la bibliothèque Chartist. La seule modération est que j'ai ajouté export avant la classe:

import React from 'react'; 
import ReactDOM from 'react-dom'; 
import ChartistGraph from '../index'; 

export class Pie extends React.Component { 
    render() { 

    var data = { 
     labels: ['W1', 'W2', 'W3', 'W4', 'W5', 'W6', 'W7', 'W8', 'W9', 'W10'], 
     series: [ 
     [1, 2, 4, 8, 6, -2, -1, -4, -6, -2] 
     ] 
    }; 

    var options = { 
     high: 10, 
     low: -10, 
     axisX: { 
     labelInterpolationFnc: function(value, index) { 
      return index % 2 === 0 ? value : null; 
     } 
     } 
    }; 

    var type = 'Bar' 

    return (
    <div> 
     <ChartistGraph data={data} options={options} type={type} /> 
    </div> 
    ) 
} 
} 

Lorsque je tente d'importer le composant dans mon composant parent à l'aide:

import {Pie} from '../components/dashboardChart'; 

Je reçois l'erreur suivante:

54:28-41 "export 'default' (imported as 'ChartistGraph') was not found in '../index'

Des idées à quoi cela cause-t-il?

Answer 1

Vous pouvez vous exporter la classe Pie comme export default class Pie extends React.Component {}

Et lorsque vous importez vous pouvez le faire comme ça import Pie from '../components/dashboardChart';