小编Jam*_*ley的帖子

我对nunjucks很新,从我所看到的这是不可能的,但我想知道是否有人想出办法.

我基本上希望基于值而不是对象的大小在nunjucks模板中执行for循环.

假设您将以下数据传递给模板.假设房间数量值是<select>元素中所选选项的值:

data : {
 numberOfRooms : 4
}

在传统的JS中,我可以编写for循环并根据numberOfRooms值限制循环:

for (var i = 0; i < data.numberOfRooms; i ++) {
  // do something...
}

我的最终目标是在Nunjucks模板中编写一个循环,该模板将复制标记块X次,其中X是numberOfRooms值.

那么,如果这是可能的,那么如何用Nunjucks实现这一目标呢？如果这完全违背了Nunjucks的目的那么请说,任何其他建议将不胜感激.

我一直在与一个新团队合作开发一个React应用程序,并围绕为触发window.scroll事件方法的组件编写单元测试.

所以,我们以此组件为例.

import React, { Component } from 'react';

class MyComponent extends Component {
  componentDidMount() {
    window.addEventListener('scroll', this.props.myScrollMethod);
  }

  componentWillUnmount() {
    window.removeEventListener('scroll', this.props.myScrollMethod);
  }

  render() {
    return (
      <div>
        <h1>Hello MyComponent!</h1>
      </div>
    )
  };
};

export default MyComponent;

正如您所看到的,我正在使用一个方法,该方法通过prop传递给组件并将其绑定到事件所在的窗口事件侦听器scroll.在现实世界中myScrollMethod,当用户向下滚动页面时,该组件将调用(假设此处的用例是当用户滚动超出页面上的某个点时显示粘性导航栏).

问题是......我需要找到一种合适的测试方法.我的最终目标是创建一个间谍方法,通过myScrollMethodprop 传递给组件,然后触发滚动(或在测试中模拟滚动),最后断言滚动处理程序方法是否已触发.以下是我对此的尝试:

import React from 'react';
import sinon from 'sinon';
import expect, { createSpy }  from 'expect';
import { shallow } from 'enzyme';

import MyComponent from './MyComponent';

describe('The <MyComponent /> component', () => {
  let …

我正在尝试订购一系列对象,在这个上下文中,我正在尝试编写一个函数,用户可以在距离地标的位置订购房屋阵列.假设我从通过AJAX调用的API返回以下数据:

"data" : [
    {
        'id' : 123,
        'address' : '12 street name',
        'city' : 'City Name',
        'landmarks' : [
            {
                'name' : 'landmark one',
                'distanceInMiles' : 0.6
            },
            {
                'name' : 'landmark two',
                'distanceInMiles' : 0.4
            }
        ]
    },
    {
        'id' : 345,
        'address' : '22 street name',
        'city' : 'City Name',
        'landmarks' : [
            {
                'name' : 'landmark one',
                'distanceInMiles' : 0.2
            },
            {
                'name' : 'landmark three',
                'distanceInMiles' : 0.1
            }
        ]
    },
    {
        'id' : 456, …