意外的命名空间导入导入/无命名空间

时间:2017-11-24 19:17:57

标签: reactjs d3.js plotly plotly-dash

我正在尝试在React中导入D3v4以生成Dash组件。到目前为止,这是我的代码:

protected void button_Click(object sender, EventArgs e)
        {
            try
            {
                int cnt = 0;

                DataTable dt = new DataTable();
                dt.Columns.Add("Certificate ID");
                dt.Columns.Add("Part Number");
                dt.Columns.Add("Part Description");


                foreach (GridViewRow row in gvPRCertInfo.Rows)
                {
                    if ((row.Cells[0].FindControl("chkCert") as CheckBox).Checked)
                    {
                        DataRow dr = dt.NewRow();
                        dr["Certificate ID"] = row.Cells[1].Text;
                        dr["Part Number"] = row.Cells[2].Text;
                        dr["Part Description"] = row.Cells[3].Text;

                        dt.Rows.Add(dr);
                        cnt++;
                    }
                }
                if (cnt <= 0)
                {
                    DataRow dr = dt.NewRow();
                    dr["Certificate ID"] = gvPRCertInfo.SelectedRow.Cells[1].Text;
                    dr["Part Number"] = gvPRCertInfo.SelectedRow.Cells[2].Text;
                    dr["Part Description"] = gvPRCertInfo.SelectedRow.Cells[3].Text;

                    dt.Rows.Add(dr);

                }

                 Session["Details"] = dt;
                Response.Redirect("url");
            }
            catch (Exception ex)
            {

            }
        }

但是当我尝试使用import React, {Component} from 'react'; import PropTypes from 'prop-types'; import * as d3 from 'd3'; function createBox(divId) { var svgContainer = d3.select(divId).append('svg') .attr('width', 200) .attr('height', 200); //Draw the Circle svgContainer.append('circle') .attr('cx', 30) .attr('cy', 30) .attr('r', 20); } /** * ExampleComponent is an example component. * It takes a property, `label`, and * displays it. * It renders an input with the property `value` * which is editable by the user. */ export default class ExampleComponent extends Component { constructor() { super(); this.plot = this.plot.bind(this); } plot(props) { createBox(props.id); } componentDidMount() { this.plot(this.props); } componentWillReceiveProps(newProps) { this.plot(newProps); } render() { const {id} = this.props; return ( <div id={id}/> ); } } ExampleComponent.propTypes = { /** * The ID used to identify this compnent in Dash callbacks */ id: PropTypes.string }; 预先发布Dash时,它会抛出错误:

$ npm run prepublish

它指向error Unexpected namespace import import/no-namespace

我正在构建Plotly提供的关于编写自己的组件的示例。

1 个答案:

答案 0 :(得分:1)

esling Docs中所述:

  

报告是否使用了名称空间导入。

所以你应该改成它:

import d3 from 'd3';

如果必须使用命名空间(如eslint docs中所述)

,请禁用该规则

<强>更新
阅读docs of d3后,他们使用相同的模式,因此我假设default没有d3导出,因此:

import d3 from 'd3';

可能无效 然后对这样的个人部分使用命名导入:

import {scaleLinear} from "d3-scale";  

或者禁用我上面提到的规则。