Friday, 24 May 2019

Upgrading materializecss from 0.100.1 to 1.0.0 results in multiple javascript errors

I'am trying to upgrade my materializecss from 0.100.1 to 1.0.0. I followed the upgrade guide and applied all the changes to my code but I am still facing multiple javascript errors. In our application we are using vue 2.6.10.

Tabs:
Our tabs are rendered by a vue component:

<ul class="tabs timerange" id="timeTab" style="width: 90%">
    <input type="hidden" id="time" v-model="$parent.syncData.currentTime">
    <li style="width:75px; display: inline-block" v-bind:data-time="value"
        v-for="(value,key) in $parent.syncData.timeGrid"
        class="tab">
        <a class="text-black" v-bind:href="'#tab_'+key"
           v-on:click="$parent.setTime(value)"> h</a>
    </li>
</ul>

Then they get initialized in a separate javascript with jquery:

$(document).ready(function() {
    $('#timeTab').tabs();
});

This results in the following error: tabs javascript error I've already tried initializing them in the created() and updated() callbacks of the vue component but without success.

Dropdown:
For dropdowns I get the following error: dropdown javasript error This error is reproducible when I comment my code for the dropdown and replace it with the example code from the materializecss docs.

How can I fix these kind of errors or where is a good start to debug?



from Upgrading materializecss from 0.100.1 to 1.0.0 results in multiple javascript errors

No comments:

Post a Comment