如何从 pug mixin 中的对象中解构嵌套道具？

Question

所以我想构建 pug mixin:

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

我是这样称呼它的：

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

+productTile(prodInfo)

但我遇到了问题：

SyntaxError: Argument name clash (366:103)

所以也许我对对象 prop 的解构有误，因为当我从 mixin 声明中删除 cat: {title = '', path = ''} = {} 时，一切正常

Answer 1

您正在解构两个字段并为它们分配名称 title，因此您会在那里遇到冲突。解构时只需重命名其中之一。例如：

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

如何从 pug mixin 中的对象中解构嵌套道具？

How to destructure nested props from object in pug mixin?

javascript

mixins

pug