viktorlarsson / vue-tiny-slider

Vanilla javascript slider for all purposes created by ganlanyuan in Vue.
MIT License
136 stars 51 forks source link

Uncaught DOMException: Failed to execute 'setAttribute' on 'Element': '' is not a valid attribute name. #74

Open Seeman13 opened 3 years ago

Seeman13 commented 3 years ago

Vue native 2.6 + Laravel 7

In app.js

...
import VueTinySlider from 'vue-tiny-slider';
...
...
components: { VueTinySlider },
...

In view blade:

...
<vue-tiny-slider :="{
                controls: true,
                items: 1.5,
                slideBy: 1,
                autoplay: false,
                nav: false,
                rewind: true,
                loop: true,
                edgePadding: 40,
                mouseDrag: true,
                responsive: {
                  1280: {
                    items: 2.2,
                    edgePadding: 150,
                  },
                  980: {
                    items: 2,
                    edgePadding: 150,
                  },
                  480: {
                    items: 1.8,
                    edgePadding: 50,
                  }
                }
              }">
                @foreach ($photos as $photo)
                    <div class="item">
                        {{ Html::image(photo) }}
                    </div>
                @endforeach
            </vue-tiny-slider>
...

And what is it not true?