Question

好吧，我在数组中有一些名为 data 的对象：

broadcast: true

在一个页面上，我只想显示mixin techs(condition) - var data = trs.tech.data; ul.techs each item in data if condition li .h2= item.title的那些，我想使用mixin调用。我的混音：

+techs('item.broadcast')

我的混音调用：

import ctypes

SPI_GETWORKAREA = 48
SPI = ctypes.windll.user32.SystemParametersInfoA

class RECT(ctypes.Structure):
    _fields_ = [
        ('left', ctypes.c_long),
        ('top', ctypes.c_long),
        ('right', ctypes.c_long),
        ('bottom', ctypes.c_long)
    ]

SPI.restype = ctypes.POINTER(RECT)
SPI.argtypes = [ctypes.c_uint, ctypes.c_uint, ctypes.c_uint]
result = SPI(SPI_GETWORKAREA, 0, 0)
print(result)

但（当然）这件事并没有像我想的那样奏效。它显示数组中的所有对象。如果没有将条件写入mixin，有没有办法得到我期望的结果？

Answer 1

从我的观点来看，对于这个给定的问题，mixin根本不应包含任何与其接收的数据相关的附加逻辑。它应该是一个简单的渲染方法，迭代列表。因此，在这种情况下，render方法专门处理已经过滤/清理/验证的数据项的列表，作为此方法的唯一参数传递。

// running, js only, demo code

var techList = [{
  title: 'Title',
  broadcast: true
}, {
  title: 'Title',
  broadcast: false
}];


function isMarkedForBroadcast(type/*, idx, list*/) {
  return (type.broadcast === true);
}


var broadcastItemList = techList.filter(isMarkedForBroadcast);

console.log('techList : ', techList);
console.log('broadcastItemList : ', broadcastItemList);

.as-console-wrapper { max-height: 100%!important; top: 0; }

//- pug/view

mixin renderTechList(list)
    ul.techs
        each item in list
            li
                .h2= item.title

-
    function isMarkedForBroadcast(type/*, idx, list*/) {
        return (type.broadcast === true);
    }

+renderTechList(trs.tech.data.filter(isMarkedForBroadcast))

Answer 2

我发现您的代码存在多个问题。您的mixin定义为techs，但您尝试拨打tech。其次，在mixin声明后缩进是不正确的。此外，该数组应作为具有标识符的对象传递。

因此，请考虑将您的JSON重组为

{
  "tempArrayName": [
    {
      "title": "Title1",
      "broadcast": true
    },
    {
      "title": "Title2",
      "broadcast": false
    }
  ]
}

你的JADE / PUG可以改写为，

mixin techs
 - var data = tempArrayName;
 ul.techs
    each item in data
        if item.broadcast
            li
              .h2= item.title
+techs

其中+techs是mixin调用，可以在多个地方重用。它使用broadcast值检查条件（希望这是你想要实现的）并打印，

<ul class="techs">
  <li>
    <div class="h2">Title1</div>
  </li>
</ul>

使用 - http://naltatis.github.io/jade-syntax-docs

进行测试

希望这有帮助。

帕格（翡翠）mixin和if声明

2 个答案: