Vue.js filtering list with multiple checkboxes

Question

I'm trying to work out how you can filter a v-for list using checkbox model array where you have multiple checkboxes ticked. Other examples I have found all do the same as my example here - just filter one checkbox at a time. Here is a simple demo of what I have so far - https://jsbin.com/fuzuzucike/1/edit?html,js,console,output as you can checkboxes 1-3 and a list of names.

If you click 1 it filters the name with id1 but then when you click 2 (with 1 still selected) no names appear. I would want names with ids 1 and 2 to show in this case. Am I missing something simple here or is it a case of having to create a custom filter to handle this functionality?

Many thanks.

gurghet · Accepted Answer · 2016-07-14 10:25:59Z

1

Filters are deprecated, use computed properties: https://jsbin.com/jofediqifi/1/edit?html,js,console,output

answered Jul 14, 2016 at 10:25

gurghet

7,6865 gold badges40 silver badges66 bronze badges

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

1 Comment

wireless-g Over a year ago

That's fantastic thank you! I'd never thought of it that way but it makes total sense.

Collectives™ on Stack Overflow

Vue.js filtering list with multiple checkboxes

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