how to truncate options in the vue-multiselect?

Question

I want to truncate many value on the vue-multiselect.

I tried this to override many class but it's not working, like this example :

.multiselect__content-wrapper {
    overflow-x: hidden;
    text-overflow: ellipsis;
}

Answer 1

You can use this to avoid text getting wrapped and multi-select height change:

.multiselect__single {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

Answer 2

If you're asking how to modify options array then use splice or slice:

var a1 = [2,4,6,8];
var a2 = a1.splice(-2,2); // a1=[2,4], a2=[6,8]

var a1 = [2,4,6,8];
var a2 = a1.slice(-2); // a1=[2,4,6,8], a2=[6,8]