Google Chart在React JS组件中不起作用

问题描述

import React,{ Component } from 'react'
import Chart from 'react-google-charts'

const data = [
    ['Element','Density',{ role: 'style' }],['copper',8.94,'#b87333'],// RGB value
    ['Silver',10.49,'silver'],// English color name
    ['Gold',19.3,'gold'],['Platinum',21.45,'color: #e5e4e2'] // css-style declaration
]

class Skill extends Component {
    render() {
        return (
            <section
                id='skills'
                className='features gray-section team'
                style={{ ['margin-top']: '0' }}
            >
                <div className='container'>
                    <div className='row'>
                        <div className='col-lg-12 text-center' id='i18_skills'>
                            <div className='navy-line'></div>
                            <h1>
                                <span data-i18n='skills.my_skills'>My Skills</span>
                            </h1>
                        </div>
                    </div>
                    <div className='row features-block'>
                        <div className='col-lg-1'>
                            <Chart
                                chartType='ColumnChart'
                                width='100%'
                                height='400px'
                                data={data}
                            />
                        </div>
                    </div>
                </div>
            </section>
        )
    }
}

export default Skill

================================================ ==================================

执行任务：npm运行dev

portfolio_app@1.0.0开发人员C：\ Users \ JAGANI \ git \ react-bootcamp \ portfolio_app 包裹src / index.html

服务器运行在http：// localhost：1234 ×C：\ Users \ JAGANI \ git \ react-bootcamp \ portfolio_app \ node_modules \ react-load-script \ lib \ index.js：JSON5：1：1无效字符'\ 0' 语法错误（C：\ Users \ JAGANI \ git \ react-bootcamp \ portfolio_app \ node_modules \ json5 \ lib \ parse.js：1：12963） 在invalidChar（C：\ Users \ JAGANI \ git \ react-bootcamp \ portfolio_app \ node_modules \ json5 \ lib \ parse.js：1：12177） 在Object.value（C：\ Users \ JAGANI \ git \ react-bootcamp \ portfolio_app \ node_modules \ json5 \ lib \ parse.js：1：3762） 在lex（C：\ Users \ JAGANI \ git \ react-bootcamp \ portfolio_app \ node_modules \ json5 \ lib \ parse.js：1：1680） 在解析时（C：\ Users \ JAGANI \ git \ react-bootcamp \ portfolio_app \ node_modules \ json5 \ lib \ parse.js：1：992） 在Object.load（C：\ Users \ JAGANI \ git \ react-bootcamp \ portfolio_app \ node_modules \ parcel-bundler \ src \ utils \ config.js：45：30） 异步加载时Babelrc（C：\ Users \ JAGANI \ git \ react-bootcamp \ portfolio_app \ node_modules \ parcel-bundler \ src \ utils \ getTargetEngines.js：117：16） 在异步getTargetEngines（C：\ Users \ JAGANI \ git \ react-bootcamp \ portfolio_app \ node_modules \ parcel-bundler \ src \ utils \ getTargetEngines.js：46：28） 在异步getEnvConfig（C：\ Users \ JAGANI \ git \ react-bootcamp \ portfolio_app \ node_modules \ parcel-bundler \ src \ transforms \ babel \ env.js：20：25） 在异步getBabelConfig（C：\ Users \ JAGANI \ git \ react-bootcamp \ portfolio_app \ node_modules \ parcel-bundler \ src \ transforms \ babel \ config.js：32：19）

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）