TypeError: Cannot read properties of undefined (reading 'load')

[Arkk92]

Since looks like no one is updating the module I'm writing this issue to whom may be interested in solving the error in the title:

I have faced this error using the Google Charts in my components, in fact it started happening when I added more than one chart in different components, so GChart was called more than once.

After digging in Google I couldn't find any solution so I read the Google documentation saying that google.chart.load shall be called only once at the begining. Since the module it's doing it by itself, I came out with a solution. I found that I we add the following line before mounting the App it was actually working fine and the error didn't show up.

import { loadGoogleCharts } from 'vue-google-charts'

loadGoogleCharts('current', { packages: ['corechart'] })

Since it looks like a usage problem more than package implementation problem, I would suggest to whoever that maintains the package to update README adding this information. I lost many hours trying to get rid of this issue.

[rexdarelandig]

jesus. thank you for this. I just added the code in my App.vue

[d4rkmen]

Excatly the same problem. Thanks for a working solution mr. @Arkk92

[samergoda]

    methods: {
            displaySideBar(statusDisplay) {
                this.displayMobileSideBar = statusDisplay;
            },
            onMounted() {
                loadGoogleCharts('current', { packages: ['corechart'] });
            },
        },

i added it in app but still have the same error

[Arkk92]

@samergoda please be careful when reading solutions, you missed the part saying to import it at the beginning. The problem is, loadGoogleCharts() shall be called only once in the whole project. If you put it in onMounted, it's going to be called every time you mount the component. Try removing the call from there and put it in the main. Hope it helps.