[Vuejs]-How to create filters for a Vue component

by

0👍

✅

You can create a vue component for a generic card with props (name, category, desc.. etc).
Then place the template in your main vue app and populate its props. That way you are not being redundant with the components.

Vue.component('blog', {
props:  [   name: String,
            category: String,
            image: String,
            age: Number
        ],
template: '<h3>{{ name }}</h3>
            <span>{{ category }}</span>
            <img v-bind:src="image">
            <span>{{ age }}</span>'})

https://v2.vuejs.org/v2/guide/components-props.html

0👍

I think you could either use props and i think that’s easiest way of doing it, since looks like you are just changing data, but if you need to render differents components you can do it with a component directive, like this:

<component v-bind:is="currentComponent"></component>

so this way you can create a mini form called search or something like that and once it got submitted, you can updated the currentComponent prop and that will render the component to need to be rendered. This is actually on the documentation:

https://v2.vuejs.org/v2/guide/components-dynamic-async.html

Leave a comment