Path problem using Object as parameters in Vue router-linkDeclarative router link not clearing model in Vue component using VueRouterVue router-link params on page load or programmatic navigationVue-Router Passing Data with Propsvue-router, can't refresh routes with dynamic id'sVuejs router 3.0.1 path issueVue router not following children pathsVue - passing props to router with router-linkVue router props not updating on page refreshDynamic Vue RouterUsing the same view component with different route, but with different props

How do I lift the insulation blower into the attic?

Should a narrator ever describe things based on a character's view instead of facts?

What is this high flying aircraft over Pennsylvania?

Why is participating in the European Parliamentary elections used as a threat?

"Marked down as someone wanting to sell shares." What does that mean?

Writing in a Christian voice

New Order #2: Turn My Way

Recursively move files within sub directories

Output visual diagram of picture

A seasonal riddle

What is the tangent at a sharp point on a curve?

Center page as a whole without centering each element individually

Would a primitive species be able to learn English from reading books alone?

1 John in Luther’s Bibel

Is there any common country to visit for persons holding UK and Schengen visas?

Why didn't Voldemort know what Grindelwald looked like?

Put the phone down / Put down the phone

Name this simple norm equality! (Real Analysis)

Is this saw blade faulty?

Reason why a kingside attack is not justified

Make a Bowl of Alphabet Soup

Do people actually use the word "kaputt" in conversation?

Why would five hundred and five same as one?

What is the period/term used describe Giuseppe Arcimboldo's style of painting?



Path problem using Object as parameters in Vue router-link


Declarative router link not clearing model in Vue component using VueRouterVue router-link params on page load or programmatic navigationVue-Router Passing Data with Propsvue-router, can't refresh routes with dynamic id'sVuejs router 3.0.1 path issueVue router not following children pathsVue - passing props to router with router-linkVue router props not updating on page refreshDynamic Vue RouterUsing the same view component with different route, but with different props













0















I have created a



<router-link :to=" name: 'casa', params: casa: item ,codCasa:item.cod_Casa "> item.cod_casa </router-link>


but now a have a problem with path. Cannot have a clear url.



item
is an object and then url is http://localhost:8080/casa/%5Bobject%20Object%5D



In routes i have




path: "/casa/:casa",
name: "casa",

component: () =>
import(/* webpackChunkName: "about" */ "./components/Casa/Casa.vue"),
props: true
,


If i use path: "/casa/:codCasa" it says codCasa is not defined.
Thanks in advance.










share|improve this question


























    0















    I have created a



    <router-link :to=" name: 'casa', params: casa: item ,codCasa:item.cod_Casa "> item.cod_casa </router-link>


    but now a have a problem with path. Cannot have a clear url.



    item
    is an object and then url is http://localhost:8080/casa/%5Bobject%20Object%5D



    In routes i have




    path: "/casa/:casa",
    name: "casa",

    component: () =>
    import(/* webpackChunkName: "about" */ "./components/Casa/Casa.vue"),
    props: true
    ,


    If i use path: "/casa/:codCasa" it says codCasa is not defined.
    Thanks in advance.










    share|improve this question
























      0












      0








      0








      I have created a



      <router-link :to=" name: 'casa', params: casa: item ,codCasa:item.cod_Casa "> item.cod_casa </router-link>


      but now a have a problem with path. Cannot have a clear url.



      item
      is an object and then url is http://localhost:8080/casa/%5Bobject%20Object%5D



      In routes i have




      path: "/casa/:casa",
      name: "casa",

      component: () =>
      import(/* webpackChunkName: "about" */ "./components/Casa/Casa.vue"),
      props: true
      ,


      If i use path: "/casa/:codCasa" it says codCasa is not defined.
      Thanks in advance.










      share|improve this question














      I have created a



      <router-link :to=" name: 'casa', params: casa: item ,codCasa:item.cod_Casa "> item.cod_casa </router-link>


      but now a have a problem with path. Cannot have a clear url.



      item
      is an object and then url is http://localhost:8080/casa/%5Bobject%20Object%5D



      In routes i have




      path: "/casa/:casa",
      name: "casa",

      component: () =>
      import(/* webpackChunkName: "about" */ "./components/Casa/Casa.vue"),
      props: true
      ,


      If i use path: "/casa/:codCasa" it says codCasa is not defined.
      Thanks in advance.







      vue.js vue-component vue-router vuetify.js






      share|improve this question













      share|improve this question











      share|improve this question




      share|improve this question










      asked Mar 7 at 20:11









      Leonel Matias DomingosLeonel Matias Domingos

      5122929




      5122929






















          1 Answer
          1






          active

          oldest

          votes


















          0














          You should pass in your path just codCasa and get the object inside your component.



          Vue Roter allows props, so we can do something like:



           
          path: "/casa/:casa",
          name: "casa",

          component: () =>
          import(/* webpackChunkName: "about" */ "./components/Casa/Casa.vue"),
          props: casa: id: 1, name: 'Casa 1'
          ,


          Where casa is defined as prop inside the component



          But it looks like the object casa is dynamic and thats why I recommend the first way, using just the ID in the path and waiting a prop called codCasa in your component. Pay attention about the type used to the prop.



          If you really need to pass the entire object and don't want to get it from backend inside the component, think about using just a child component without a new route.






          share|improve this answer























          • casa is dynamic. I dont want to get the object again ...and <template v-for="(item, index) in casas"> is constructing the router link ...<router-link :to=" name: 'casa', params: casa: item ,codCasa:item.cod_Casa "> item.cod_casa </router-link>

            – Leonel Matias Domingos
            Mar 7 at 21:07












          • the problem is just the url...i have all data i need

            – Leonel Matias Domingos
            Mar 7 at 21:10












          • Right, so that's what I said. We usually don't pass objects in path parameters and if you really need to pass the entire object and don't want to get it from backend inside the component, think about using just a child component without a new route.

            – Matheus Valenza
            Mar 8 at 0:11










          Your Answer






          StackExchange.ifUsing("editor", function ()
          StackExchange.using("externalEditor", function ()
          StackExchange.using("snippets", function ()
          StackExchange.snippets.init();
          );
          );
          , "code-snippets");

          StackExchange.ready(function()
          var channelOptions =
          tags: "".split(" "),
          id: "1"
          ;
          initTagRenderer("".split(" "), "".split(" "), channelOptions);

          StackExchange.using("externalEditor", function()
          // Have to fire editor after snippets, if snippets enabled
          if (StackExchange.settings.snippets.snippetsEnabled)
          StackExchange.using("snippets", function()
          createEditor();
          );

          else
          createEditor();

          );

          function createEditor()
          StackExchange.prepareEditor(
          heartbeatType: 'answer',
          autoActivateHeartbeat: false,
          convertImagesToLinks: true,
          noModals: true,
          showLowRepImageUploadWarning: true,
          reputationToPostImages: 10,
          bindNavPrevention: true,
          postfix: "",
          imageUploader:
          brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
          contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
          allowUrls: true
          ,
          onDemand: true,
          discardSelector: ".discard-answer"
          ,immediatelyShowMarkdownHelp:true
          );



          );













          draft saved

          draft discarded


















          StackExchange.ready(
          function ()
          StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55052070%2fpath-problem-using-object-as-parameters-in-vue-router-link%23new-answer', 'question_page');

          );

          Post as a guest















          Required, but never shown

























          1 Answer
          1






          active

          oldest

          votes








          1 Answer
          1






          active

          oldest

          votes









          active

          oldest

          votes






          active

          oldest

          votes









          0














          You should pass in your path just codCasa and get the object inside your component.



          Vue Roter allows props, so we can do something like:



           
          path: "/casa/:casa",
          name: "casa",

          component: () =>
          import(/* webpackChunkName: "about" */ "./components/Casa/Casa.vue"),
          props: casa: id: 1, name: 'Casa 1'
          ,


          Where casa is defined as prop inside the component



          But it looks like the object casa is dynamic and thats why I recommend the first way, using just the ID in the path and waiting a prop called codCasa in your component. Pay attention about the type used to the prop.



          If you really need to pass the entire object and don't want to get it from backend inside the component, think about using just a child component without a new route.






          share|improve this answer























          • casa is dynamic. I dont want to get the object again ...and <template v-for="(item, index) in casas"> is constructing the router link ...<router-link :to=" name: 'casa', params: casa: item ,codCasa:item.cod_Casa "> item.cod_casa </router-link>

            – Leonel Matias Domingos
            Mar 7 at 21:07












          • the problem is just the url...i have all data i need

            – Leonel Matias Domingos
            Mar 7 at 21:10












          • Right, so that's what I said. We usually don't pass objects in path parameters and if you really need to pass the entire object and don't want to get it from backend inside the component, think about using just a child component without a new route.

            – Matheus Valenza
            Mar 8 at 0:11















          0














          You should pass in your path just codCasa and get the object inside your component.



          Vue Roter allows props, so we can do something like:



           
          path: "/casa/:casa",
          name: "casa",

          component: () =>
          import(/* webpackChunkName: "about" */ "./components/Casa/Casa.vue"),
          props: casa: id: 1, name: 'Casa 1'
          ,


          Where casa is defined as prop inside the component



          But it looks like the object casa is dynamic and thats why I recommend the first way, using just the ID in the path and waiting a prop called codCasa in your component. Pay attention about the type used to the prop.



          If you really need to pass the entire object and don't want to get it from backend inside the component, think about using just a child component without a new route.






          share|improve this answer























          • casa is dynamic. I dont want to get the object again ...and <template v-for="(item, index) in casas"> is constructing the router link ...<router-link :to=" name: 'casa', params: casa: item ,codCasa:item.cod_Casa "> item.cod_casa </router-link>

            – Leonel Matias Domingos
            Mar 7 at 21:07












          • the problem is just the url...i have all data i need

            – Leonel Matias Domingos
            Mar 7 at 21:10












          • Right, so that's what I said. We usually don't pass objects in path parameters and if you really need to pass the entire object and don't want to get it from backend inside the component, think about using just a child component without a new route.

            – Matheus Valenza
            Mar 8 at 0:11













          0












          0








          0







          You should pass in your path just codCasa and get the object inside your component.



          Vue Roter allows props, so we can do something like:



           
          path: "/casa/:casa",
          name: "casa",

          component: () =>
          import(/* webpackChunkName: "about" */ "./components/Casa/Casa.vue"),
          props: casa: id: 1, name: 'Casa 1'
          ,


          Where casa is defined as prop inside the component



          But it looks like the object casa is dynamic and thats why I recommend the first way, using just the ID in the path and waiting a prop called codCasa in your component. Pay attention about the type used to the prop.



          If you really need to pass the entire object and don't want to get it from backend inside the component, think about using just a child component without a new route.






          share|improve this answer













          You should pass in your path just codCasa and get the object inside your component.



          Vue Roter allows props, so we can do something like:



           
          path: "/casa/:casa",
          name: "casa",

          component: () =>
          import(/* webpackChunkName: "about" */ "./components/Casa/Casa.vue"),
          props: casa: id: 1, name: 'Casa 1'
          ,


          Where casa is defined as prop inside the component



          But it looks like the object casa is dynamic and thats why I recommend the first way, using just the ID in the path and waiting a prop called codCasa in your component. Pay attention about the type used to the prop.



          If you really need to pass the entire object and don't want to get it from backend inside the component, think about using just a child component without a new route.







          share|improve this answer












          share|improve this answer



          share|improve this answer










          answered Mar 7 at 20:53









          Matheus ValenzaMatheus Valenza

          615




          615












          • casa is dynamic. I dont want to get the object again ...and <template v-for="(item, index) in casas"> is constructing the router link ...<router-link :to=" name: 'casa', params: casa: item ,codCasa:item.cod_Casa "> item.cod_casa </router-link>

            – Leonel Matias Domingos
            Mar 7 at 21:07












          • the problem is just the url...i have all data i need

            – Leonel Matias Domingos
            Mar 7 at 21:10












          • Right, so that's what I said. We usually don't pass objects in path parameters and if you really need to pass the entire object and don't want to get it from backend inside the component, think about using just a child component without a new route.

            – Matheus Valenza
            Mar 8 at 0:11

















          • casa is dynamic. I dont want to get the object again ...and <template v-for="(item, index) in casas"> is constructing the router link ...<router-link :to=" name: 'casa', params: casa: item ,codCasa:item.cod_Casa "> item.cod_casa </router-link>

            – Leonel Matias Domingos
            Mar 7 at 21:07












          • the problem is just the url...i have all data i need

            – Leonel Matias Domingos
            Mar 7 at 21:10












          • Right, so that's what I said. We usually don't pass objects in path parameters and if you really need to pass the entire object and don't want to get it from backend inside the component, think about using just a child component without a new route.

            – Matheus Valenza
            Mar 8 at 0:11
















          casa is dynamic. I dont want to get the object again ...and <template v-for="(item, index) in casas"> is constructing the router link ...<router-link :to=" name: 'casa', params: casa: item ,codCasa:item.cod_Casa "> item.cod_casa </router-link>

          – Leonel Matias Domingos
          Mar 7 at 21:07






          casa is dynamic. I dont want to get the object again ...and <template v-for="(item, index) in casas"> is constructing the router link ...<router-link :to=" name: 'casa', params: casa: item ,codCasa:item.cod_Casa "> item.cod_casa </router-link>

          – Leonel Matias Domingos
          Mar 7 at 21:07














          the problem is just the url...i have all data i need

          – Leonel Matias Domingos
          Mar 7 at 21:10






          the problem is just the url...i have all data i need

          – Leonel Matias Domingos
          Mar 7 at 21:10














          Right, so that's what I said. We usually don't pass objects in path parameters and if you really need to pass the entire object and don't want to get it from backend inside the component, think about using just a child component without a new route.

          – Matheus Valenza
          Mar 8 at 0:11





          Right, so that's what I said. We usually don't pass objects in path parameters and if you really need to pass the entire object and don't want to get it from backend inside the component, think about using just a child component without a new route.

          – Matheus Valenza
          Mar 8 at 0:11



















          draft saved

          draft discarded
















































          Thanks for contributing an answer to Stack Overflow!


          • Please be sure to answer the question. Provide details and share your research!

          But avoid


          • Asking for help, clarification, or responding to other answers.

          • Making statements based on opinion; back them up with references or personal experience.

          To learn more, see our tips on writing great answers.




          draft saved


          draft discarded














          StackExchange.ready(
          function ()
          StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55052070%2fpath-problem-using-object-as-parameters-in-vue-router-link%23new-answer', 'question_page');

          );

          Post as a guest















          Required, but never shown





















































          Required, but never shown














          Required, but never shown












          Required, but never shown







          Required, but never shown

































          Required, but never shown














          Required, but never shown












          Required, but never shown







          Required, but never shown







          Popular posts from this blog

          How to get text form Clipboard with JavaScript in Firefox 56?How to validate an email address in JavaScript?How do JavaScript closures work?How do I remove a property from a JavaScript object?How do you get a timestamp in JavaScript?How do I copy to the clipboard in JavaScript?How do I include a JavaScript file in another JavaScript file?Get the current URL with JavaScript?How to replace all occurrences of a string in JavaScriptHow to check whether a string contains a substring in JavaScript?How do I remove a particular element from an array in JavaScript?

          Can't initialize raids on a new ASUS Prime B360M-A motherboard2019 Community Moderator ElectionSimilar to RAID config yet more like mirroring solution?Can't get motherboard serial numberWhy does the BIOS entry point start with a WBINVD instruction?UEFI performance Asus Maximus V Extreme

          List of MPs elected to the English parliament in 1640 (April) Contents List of constituencies and members See also Notes References Navigation menueNational Archives – The Glynde Place ArchivesCobbett's Parliamentary history of England, from the Norman Conquest in 1066 to the year 1803'Aldermen in Parliament', The Aldermen of the City of London: Temp. Henry III – 1912onepage&q&f&#61, false 229