vue child component

<template> <Component-a></Component-a> </template> <script> import ComponentA from './ComponentA.vue' export default { components: { ComponentA } // ..., } </script>  <template>  <client-only> <Component-a></Component-a> </client-only> </template> <script> export default { components: { // Dynamic import for client side rendering (you can use normaly also) ComponentA: () => import('./ComponentA.vue') } } </script>

how to access both child event param and parent param in vue

<template>
    <ul>
        <product v-for="product in products"
                 :product="product"
                 @add="addToChart" />
    </ul>
</template>

<script>
const Product = {
    props: ["product"],
    render(h) {
        return h("li", { on: { click: this.click } }, this.product);
    },
    methods: {
        click() {
            this.$emit("add", { product: this.product, quantity: 42 });
        }
    }
};

export default {
    data() {
        return {
            products: ["Foo", "Bar"]
        };
    },
    components: {
        Product
    },
    methods: {
        addToChart({ product, quantity }) {
            console.log(product, quantity);
        }
    }
}
</script>

Posted by: Guest on April-30-2020

Source

Code answers related to "vue child component"

Code answers related to "Html"

Browse Popular Code Answers by Language

Answers for "vue child component"

Code answers related to "vue child component"

Code answers related to "Html"

Browse Popular Code Answers by Language

Popular Programming Languages

Advertisements

Company

Compilers

Help

Connect with us