Passing object data to vue multiselect

I have a variable description description: this.products[0].description and if I will show it in template {{description}} everything will be fine, but if I will use multiselect

<Multiselect
                                    v-model="value"
                                    mode="tags"
                                    :close-on-select="false"
                                    :searchable="true"
                                    :create-option="true"
                                    :options=this.options
                                />

where options is equal to

options: [
                        this.description
                    ]

It will show nothing. I think the reason is that it is object, but I tried things like JSON.stringify and toString() too, but it won´t do any change in the result. Any ideas how to solve it?

SteamDiesel

3 years ago

Level 6

Can you please share an example of the full options list that gets passed to the multiselect component.

As I read this, it just looks like you're putting this.description as the only item in an array. Reading the docs for multiselect, it looks like the :options parameter is expecting an array of strings. https://vue-multiselect.js.org/#sub-single-select

So define your options as an array of strings and see how that goes.

data(){
	return {
		options: ['apples', 'bananas', 'watermelon', 'oranges']
	}
}

If this isn't going to work then tell us more about where that 'this.description' item is coming from.

laravel_beginner

3 years ago

Level 1

@SteamDiesel I tried to add more strings after and before this. description. The result is that it will change nothing. The one option that is not this. description, but some other string will show, and this. description is an option but without text. And I forgot to mention if I do JSON.stringify or toString(), it will instead of any text write object is undefined.

Please or to participate in this conversation.