J
I tried but I am facing following issue
velocity-core.js:1 RangeError: Invalid array length
at a.ge [as _l] (velocity-core.js:1)
at a.render (velocity.js:1)
at a.t._render (velocity-core.js:1)
at a.hn.before (velocity-core.js:1)
at hn.get (velocity-core.js:1)
at new hn (velocity-core.js:1)
at velocity-core.js:1
at a.$n.$mount (velocity-core.js:1)
at a.$n.$mount (velocity-core.js:1)
at init (velocity-core.js:1)
My component
<template>
<carousel
:rtl="localeDirection == 'rtl'"
:dir="localeDirection"
:id="id"
:navigationEnabled="true"
:paginationEnabled="true"
:perPage="parseInt(slidesPerPage)"
:loop="loop == 'true' ? true : false"
:autoplay="autoplay == 'true' ? true : false"
:autoplayTimeout="timeout ? parseInt(timeout) : 2000"
:autoplayDirection="'forward'"
:class="[
localeDirection,
(navigationEnabled == 'hide') ? 'navigation-hide' : '',
(paginationEnabled == 'hide') ? 'pagination-hide' : '',
addClass
]">
<slot
v-for="index in parseInt(slidesCount)"
:name="`slide-${parseInt(index) - 1}`">
</slot>
</carousel>
</template>
<script type="text/javascript">
export default {
props: [
'id',
'loop',
'timeout',
'autoplay',
'addClass',
'direction',
'slidesCount',
'slidesPerPage',
'localeDirection',
'navigationEnabled',
'paginationEnabled',
],
data: function () {
return {}
},
methods: {
slideClicked: function () {
debugger
}
}
}
</script>
My blade file code
<?php
$features=app('MiimModule\SafetyAndSecurity\Models\SafetyAndSecurity')::all();
$banners=[];
foreach($features as $feature)
{
// $banners[]=;
$banners[]=asset('storage/safetyandsecurityimages/'.$feature->icon_url);
}
// echo '<pre>';print_r($banners);echo '</pre>';die();
?>
<carousel-component
direction="{{ core()->getCurrentLocale()->direction }}"
default-banner="{{ asset('/themes/velocity/assets/images/banner.webp') }}"
banners="{{ json_encode($banners) }}"
perPage="{{ count($banners) }}"
>
@if(! empty($banners))
<img class="col-12 no-padding banner-icon" src="{{ $banners[0] }}" alt=""/>
@else
<img class="col-12 no-padding banner-icon" src="{{ asset('/themes/velocity/assets/images/banner.webp') }}" alt=""/>
@endif
</carousel-component>
Please check my code and let me know my issue.
Thanks
