Nxt.js (Vue.js) + typescript code has some incomprehensible parts

<nuxt-link> and some code using the to attribute did not make sense, so I would like to ask you a question.

Below is the nuxt-link.
Bind the to attribute and pass the to (argument 1, argument 2).

<nuxt-link:to="to(id,id2)">
  <!-- What's in the link-->
</nuxt-link>

to(){
  return(id1:string, id2:string)=>({
    name: "slug1-slugId1-slug2-slugId2",
    params: {
      slugId1,
      slugId2
    }
  });
},

I'm not sure what the function definition of to (argument 1, argument 2) says.

Below is what I understand.

First, return to() a function with two arguments
Written by Arrow function
The arguments 1 and 2 of to have both the type of string
URL will look like slug1/1234/slug2/123 using named route

What I don't understand is how to write the Arrow function.
My understanding of Arrow function is

 (argument 1, argument 2) = > {
  // Handling of something
}

I thought I would write like this, but

Now

 (argument 1, argument 2) = >({
  name: "slug1-slugId1-slug2-slugId2",
  params: {
    slugId1,
    slugId2
  }
})

It says like and I don't understand the existence of ( ) right behind the arrow.

Why is this written like this?

javascript typescript nuxt.js

2022-09-30 21:54

1 Answers

Short syntax for omitting return in the Arrow function.If () is not present, it is parsed as a sentence column.

The following myFunc1 and myFunc2 provide the same return value.

const myFunc1=(slugId1:string, slugId2:string)=>({
  name: "slug1-slugId1-slug2-slugId2",
  params: {
    slugId1,
    slugId2,
  },
});

const myFunc2=(slugId1:string, slugId2:string)=>{
  US>return{
    name: "slug1-slugId1-slug2-slugId2",
    params: {
      slugId1,
      slugId2,
    },
  };
};

Returns Object literal - MDN

2022-09-30 21:54

If you have any answers or tips

Popular Tags

python x 4647

android x 1593

java x 1494

javascript x 1427

c x 927

c++ x 878

ruby-on-rails x 696

php x 692

python3 x 685

html x 656