Home  >  Q&A  >  body text

"Nuxt.js: Pass ID using URL"

<p>I want to get the user ID, so I have a dropdown button =</p> <pre class="brush:html;toolbar:false;"><v-menu transition="slide-y-transition" bottom offset-y > <template v-slot:activator="{ on, attrs }" > <v-btn color="primary" dark v-bind="attrs" v-on="on" > list </v-btn> </template> <v-list> <v-list-item v-for="(item, index) in items" :key="index" :to="item.url" > <v-list-item-title>{{item.title}}</v-list-item-title> </v-list-item> </v-list> </v-menu> </pre> <p>And this data:</p> <pre class="brush:html;toolbar:false;"><script> export default { data: () => ({ items: [ { title: 'User List', url: ''/user/function/listUser/${route.params.id}`' }, { title: 'User Structure', url: ''/user/function/structUser/${route.params.id}`' } ] }) } </script> </pre> <p>My intention is to send the user ID. This way, I can actually get </p> via <code>route.params.id</code> <pre class="brush:js;toolbar:false;">url: ''/user/function/structUser/${route.params.id}`' </pre> <p>Not working, what did I do wrong? </p>
P粉511985082P粉511985082327 days ago381

reply all(2)I'll reply

  • P粉060112396

    P粉0601123962023-08-26 23:14:24

    1. The template string only uses backticks, but your string uses both single quotes and backticks.

    2. The
    3. replacement value (route.params.id) refers to a route variable that appears to be undefined in your example. I think you want to access this.$route, so the actual replacement should be this.$route.params.id

    itemsThe array should look like this:

    export default {
      data() {
        return {
          items: [
            {
              title: 'List User',
              url: `/user/function/listUser/${this.$route.params.id}`
            },
            {
              title: 'structure User',
              url: `/user/function/structUser/${this.$route.params.id}`
            }    
          ]
        }
      }
    }
    

    Demo

    reply
    0
  • P粉293341969

    P粉2933419692023-08-26 09:53:54

    This is an example

    `/user/function/structUser/${this.$route.params.id}`
    

    Also, maybe try using it inside a computed as it may not be a computed property.

    reply
    0
  • Cancelreply