laravel vue inertia paginator remove prev and next links

Question

Im trying to remove prev and next links from array. Using laravel vue3 inertiajs.

const splicedlinks = computed(() => {
    let prevIndex = props.links.meta.links
        .map((link) => link.label)
        .indexOf("&laquo; Previous");
    let nextIndex = props.links.meta.links
        .map((link) => link.label)
        .indexOf("Next &raquo;");

    props.links.meta.links.splice(prevIndex, 1);
    props.links.meta.links.splice(nextIndex, 1);

    return props.links.meta.links;
});

With this code i managed only to remove "« Previous", but not "Next »"

navigation image

Whats wrong with my code?

i explained what i tried in question.

AlekseiKrivo · Accepted Answer · 2023-05-06 17:07:14Z

1

Because the index of the "Next" element was changed after the first "splice" using.

JS Array splice method affects the source array. So the found elements indexes are not relevant after deleting an element by "splice" method.

You should to find "nextIndex" after deleting an element by "prevIndex"

Try this:

const splicedlinks = computed(() => {
    let prevIndex = props.links.meta.links
        .map((link) => link.label)
        .indexOf("&laquo; Previous");

    // Remove "Previous" button
    props.links.meta.links.splice(prevIndex, 1);

    // After "Previous" button deleting find index of "Next" button
    let nextIndex = props.links.meta.links
        .map((link) => link.label)
        .indexOf("Next &raquo;");
    
    // Remove "Next" button
    props.links.meta.links.splice(nextIndex, 1);

    return props.links.meta.links;
});

Also, you can simplify your code by using "findIndex" methods instead indexOf

Example:

let nextIndex = props.links.meta.links?.findIndex((link) => link.label === "Next &raquo;");

edited May 6, 2023 at 17:07

answered May 6, 2023 at 16:59

AlekseiKrivo

4562 silver badges8 bronze badges

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

1 Comment

Metchanisng Over a year ago

thank you very much for the explanation and the code. Works!

Collectives™ on Stack Overflow

laravel vue inertia paginator remove prev and next links

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related