Cannot read property 'split' of undefined Javascript

Question

I'm using Algolia instantsearch and I'm trying to remove public from the image url so that it can display the image. The url looks like this public/photos/436Rga0UafNBJkBe6b5X0DJL49jcife687sqqgeI.jpegon Algolia indices attributes, so the final url looks like http://127.0.0.1:8000/storage/public/photos/436Rga0UafNBJkBe6b5X0DJL49jcife687sqqgeI.jpeg. I want to remove that public so it can be http://127.0.0.1:8000/storage/photos/436Rga0UafNBJkBe6b5X0DJL49jcife687sqqgeI.jpeg. I have tried to use split('public').pop() but I get an error Cannot read property 'split' of undefined Javascript. How can I replace that?

search.addWidget(
    instantsearch.widgets.hits({
        container: '#hits',
        templates: {
            empty: 'No results',
            item: function(item) {
                return `
                <div>
                  <img src="${window.location.origin}/storage/${item.products_photos.split('public').pop()}" alt="img" class="algolia-thumb-result">
                    </div> 
                `;
            }
        }
    })
);

dave · Accepted Answer · 2020-08-05 21:38:20Z

2

You probably need to make sure that item.products_photos exists, a simple fix would be

<img src="${window.location.origin}/storage/${(item.products_photos || '').split('public').pop()}" alt="img" class="algolia-thumb-result">

answered Aug 5, 2020 at 21:38

dave

65.1k6 gold badges81 silver badges98 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

user11710915 Over a year ago

This doesn't display the image , the url looks like http://127.0.0.1:8000/storage/ @dave

dave Over a year ago

then you need to look at item and see what is actually in it, right now there doesn't seem to be a .products_photos in it

PacCol · Accepted Answer · 2020-08-05 21:55:19Z

2

You can use replace :

var test = "someAdress/public/someText.jpeg";
test = test.replace("public/","");
console.log(test);

So try this :

<img src="${window.location.origin}/storage/${item.products_photos.replace("public/","");}" alt="img" class="algolia-thumb-result">

edited Aug 5, 2020 at 21:55

answered Aug 5, 2020 at 21:39

PacCol

2852 silver badges17 bronze badges

Collectives™ on Stack Overflow

Cannot read property 'split' of undefined Javascript

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related