如何在 pug mixin 中解构 object 中的嵌套道具？

Question

So i want to build pug mixin:

mixin productTile({img, title, desc, price, withCatLink = false, cat: {title = '', path = ''} = {}})
  .ProductTile
    p
      +icon({name: 'long-arrow-right'})

I'm calling it like that:

-
  const prodInfo = {
    img: '/img/icon.png',
    title: 'test title',
    desc: 'testdesc',
    price: '1200',
    withCatLink: true,
    cat: {
      title: 'test category',
      path: ''
    }
  };

+productTile(prodInfo)

But i'm facing with the problem:

SyntaxError: Argument name clash (366:103)

So maybe i'm wrong with object prop desctructuring, cause when i'm removing cat: {title = '', path = ''} = {} from mixin declaration there is everything ok

Answer 1

You are destructuring two fields assigning them the name title so you get the clash there. Just rename one of them when destructuring. For example:

mixin productTile({img, title, desc, price, withCatLink = false, cat: {title: catalogTitle = '', path = ''} = {}})
  .ProductTile
    p
      +icon({name: 'long-arrow-right'})