使用LoDash链和map来创建组件。 Quote.slides in .map未定义

时间:2018-03-26 17:26:21

标签: javascript dictionary filter lodash chain

我正在尝试从.filter()数组的过滤值创建React组件。 QuoteSlides按预期工作,但.map(QuoteSlides=>中的QuoteSlides变量未定义。数组let quoteList = shipment.quotes const QuoteSlides = _ .chain(quoteList) .filter(['state', 'accepted']) .map((QuoteSlides) => { <div key={`quote${QuoteSlides.id}`}> <p>{QuoteSlides.amount}</p> </div> }) .value(); 只有1个元素。

[{id: 1, state:'accepted', amount: 1000},{id:2, state:'pass', amount: 500}]

shipment.quotes =

的简化版本
     okButton.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View v) {
                for (int i = 0; i < testDialogLayout.getChildCount(); i++) {
                    View innerView = testDialogLayout.getChildAt(i);
                    if (innerView instanceof LinearLayout) {
                        LinearLayout linearLayout = (LinearLayout) innerView;
                        CheckBox cb = (CheckBox) linearLayout.findViewById(i);

                        //do something with cb

                    }
                }
            }
        });

1 个答案:

答案 0 :(得分:1)

2个问题,一个过滤器列入一个列表(已经在链上下文中)和谓词函数...你需要返回地图结果的第二个问题,看看大小写仍然不清楚...我也刚刚重命名你升级变量(它看起来好多了):

class App extends React.Component {

    render(){
    
    let quoteList = [{id: 1, state:'accepted', amount: 1000},{id:2, state:'pass', amount: 500}];
    const QuoteSlides = _.chain(quoteList)
                .filter((quote)=> (quote.state == 'accepted'))
                .map((quote) => (
                   <div key={`quote${quote.id}`}>
                     <p>{quote.amount}</p>
                   </div>
                   )).value();
    
      return <div>
        <h1>Test concept </h1>
        {QuoteSlides}
        
      </div>
    }

}

ReactDOM.render(<App/>, document.getElementById('root'))
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.21.1/babel.min.js"></script>


<div id='root'>
</div>