0

I am building a slideshow by having a navbar.js document with:

  images[0] = "{{ asset('cover/deanna-j-3GZlhROZIQg-unsplash.jpg')}}";
  images[1] = "{{ asset('cover/kevin-laminto-iRZQjV--Z_4-unsplash.jpg')}}";
  images[2] = "{{ asset('cover/pexels-andrew-neel-2123337.jpg')}}";
  images[3] = "{{ asset('cover/pexels-leah-kelley-952588.jpg')}}";
  images[4] = "{{ asset('cover/pexels-pixabay-460736.jpg')}}";
  images[5] = "{{ asset('cover/pexels-tiff-ng-2711718.jpg')}}";

in in the frontend the slideshow is working but javascript doesn't translate asset into: http://127.0.0.1:8000/cover/deanna-j-3GZlhROZIQg-unsplash.jpg which why the pictures are not showing.

How can javascript read a javascript laravel asset?

Gijs Machielsen
  • 5
  • 3

2 Answers2

0

you can create a window object for asset url

in main layout.blade.php

<script>
    window.asset = "{{ asset('/') }}";
</script>

then in navbar.js

you can get asset

let images = [];

images[0] = window.asset+"cover/deanna-j-3GZlhROZIQg-unsplash.jpg";
images[1] = window.asset+"cover/kevin-laminto-iRZQjV--Z_4-unsplash.jpg";
images[2] = window.asset+"cover/pexels-andrew-neel-2123337.jpg";
images[3] = window.asset+"cover/pexels-leah-kelley-952588.jpg";
images[4] = window.asset+"cover/pexels-pixabay-460736.jpg";
images[5] = window.asset+"cover/pexels-tiff-ng-2711718.jpg";
Kamlesh Paul
  • 11,778
  • 2
  • 20
  • 33
  • It is display in the console: http://127.0.0.1:8000/undefinedcover/deanna-j-3GZlhROZIQg-unsplash.jpg 404 (Not Found) it is displaying undefinedcover instead of cover – Gijs Machielsen Nov 26 '20 at 12:45
  • you have to put `window.asset = "{{ asset('/') }}";` in your main blade file and that file should have this `navbar.js` file and `window.asset` declare this before `navbar.js` so it can be accessed – Kamlesh Paul Nov 27 '20 at 03:37
0
images[1] = 'cover/kevin-laminto-iRZQjV--Z_4-unsplash.jpg';
images[2] = 'cover/pexels-andrew-neel-2123337.jpg';
images[3] = 'cover/pexels-leah-kelley-952588.jpg';
images[4] = 'cover/pexels-pixabay-460736.jpg';
images[5] = 'cover/pexels-tiff-ng-2711718.jpg'; ```
Gijs Machielsen
  • 5
  • 3