[Vuejs]-How to pass parameter from Vue root to component?

by

0👍

You are passing “userId” in your template but userId is not defined in your vue’s data function and hence is not reactive which means you cannot use it in DOM unless you declare it in data function.

Also root view does not require props, props should have only those element which the component is going to receive from the parent component.

So your code for root element must look something like this

import Vue from "vue";
import Cart from "./Components/Cart.vue";

new Vue({
    el: "#cartApp",
    template: '<Cart :userId="userId" />',
    data: function(){
      return {
        userId: userid, // Accessing userId from global scope as it is defined in Index.cshtml.
      }
    },
    components: {
        Cart
    }
});

Leave a comment