ChartJS Error when I&#039;m not even using it in my proj

Topic: ChartJS Error when I'm not even using it in my project

digitalmanagerguru free asked 4 years ago

When I force one component with a dynamic v-for to re-render, using the key attribute:

<force-render :key="componentKey"></force-render>

I start having the console full of errors: TypeError: this.data.map is not a function TypeError: this.data.find is not a function

And it comes from chartJS:

/*!
 * chartjs-plugin-datalabels v0.7.0
 * https://chartjs-plugin-datalabels.netlify.com
 * (c) 2019 Chart.js Contributors
 * Released under the MIT license
 */

To be exact on this method:

methods:{setSelected:function(){this.selectedItems=this.data.map((function(t,e){return t.index=e,t}))

and this:

,maxHeight:function(){var t=this.data.find((function(t){return t.secondaryText}))

I'm not doing tree shaking. I am thinking on doing it to see if it solves it. But in any case, this shouldnt happen.

best regards

Mikołaj Smoleński staff commented 4 years ago

Thanks for reporting this issue. We didn't test all our components for force rendering. We will check charts and try to find the solution soon. Best regards

Add comment

digitalmanagerguru free answered 4 years ago

0 0 Best answer

Please insert min. 20 characters.

I dig more on this problem and found out that the problem comes after all from mdbSelect:

const secondary = this.data.find(el => el.secondaryText);

Should have at least a verification if this.data is an array or not.

Something as:

if(!!this.data.length) {
      const secondary = this.data.find(el => el.secondaryText);
      }

And the same here:

this.selectedItems = this.data
        .map((option, i) => {
          option.index = i;
          return option;
        })
        .filter(option => option.selected)
        .map(option => option.index);

it needs the same validation on the this.data

Best regards

Mikołaj Smoleński staff commented 4 years ago

Thanks for update. We're still having the issue on our bug list. Best regards

Add comment

Write

Create snippet

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

ForumUser: Free
Premium support: No
Technology: MDB Vue
MDB Version: 6.6.0
Device: Desktop
Browser: Chrome
OS: Win.10 Pro
Provided sample code: No
Provided link: No

digitalmanagerguru

579Support score
57Questions 29Answers 1Snippets