在用lodash过滤mongoDB集合数组时如何使用'大于'？

admin管理员组

文章数量:815020

在用lodash过滤mongoDB集合数组时如何使用'大于'？

我如何用“大于”过滤具有mongoDB集合的数组？

我到目前为止所做的所有过滤器都是恒定的，像这样：

this.setState({ dataList: _.filter(this.state.dataList, { "Name": "Samuel" }) });

因此，在这种情况下，它将向我显示名称等于塞缪尔的所有物品。

我想做的是向我显示所有早于'x'的项目。我尝试从mongoDB文档中使用$ gt 像这样：

this.setState({ dataList: _.filter(this.state.dataList, { "age": {$gte: 20 }) });

而且我也尝试使用功能这种方式：

this.setState({ dataList: _.filter(this.state.dataList, ({age}) => age > 20) });

通过失眠症输入：

{
    "name": "John",
    "age": 10
}

通过调试菜单中的console.log输出：

[
    {
        "_id": "5e44ab5a38de8c2238750a22",
        "name": "Samuel",
        "age": "25",
        "__v": 0
      },
      {
        "_id": "5e44ac0d38de8c2238750a23",
        "name": "John",
        "age": "10"
        "__v": 0
      }
    ]

[预期结果将只是显示塞缪尔的数据，但使用$gte不会显示任何内容，而使用函数({age}) => age > 20)则会显示两者。

代码：

import React, { Component } from 'react';
import { ScrollView, FlatList, View, Modal, Text, TouchableOpacity } from 'react-native';
import { withNavigation } from 'react-navigation';
import { CheckBox, ListItem, Fab, Icon } from 'native-base';
import listStyle from './style';
import Card from '../Card/index';
import api from '../../service/api';
import _ from "lodash";


class Names extends Component {
    static navigationOptions = { header: null };
    constructor(props) {
        super(props);
        this.state = {
            dataList: [],
            fullData: [],
            modalVisible: false,
            filterName: false,
            filteArge: false,
            loading: false
        };
    }

    UNSAFE_componentWillMount() {
        return api
            .get('/main')
            .then(responseJson => {
                this.setState({
                    dataList: responseJson.data,
                    fullData: responseJson.data,
                    loading: false
                });
            })
            .catch(error => {
                console.error('server off');
            });
    }

    fName = async () => {
        if (this.state.filterName)
            await this.setState({ filterName: false });
        else
            await this.setState({ filterName: true });
    }
    fAge = async () => {
        if (this.state.filterAge)
            await this.setState({ filterAge: false });
        else
            await this.setState({ filterAge: true });
    }

    filter = () => {
        this.setState({ dataList: this.state.fullData });
        if ((this.state.filterName) === true) {
            this.setState({ dataList: _.filter(this.state.dataList, { "Name": "Samuel" }) });
        }
        if ((this.state.filterAge) === true) {
            this.setState({ dataList: _.filter(this.state.dataList, ({ age }) => age > 20) });
        }
    };
    render() {
        return (
            <View>
                <ScrollView >
                    <FlatList
                        data={this.state.dataList}
                        renderItem={({ item }) => <Card item={item} />}
                        keyExtractor={item => item._id}
                    />
                </ScrollView>
                <View>
                    <Modal
                        animationType="fade"
                        visible={this.state.modalVisible}
                        transparent={true}
                    >
                        <View>
                            <Text> Name= Samuel</Text>
                            <ListItem>
                                <CheckBox onPress={this.fName} checked={this.state.filterName} />
                                <Text  >Yes</Text>
                            </ListItem>
                            <Text> age > 20</Text>
                            <ListItem >
                                <CheckBox onPress={this.fAge} checked={this.state.filterAge} />
                                <Text >Yes</Text>
                            </ListItem>
                            <TouchableOpacity
                                onPress={() => {
                                    this.setState({ modalVisible: false });
                                    this.filter();
                                    console.log(this.state.dataList);
                                }}
                            >
                                <Text>Close</Text>
                            </TouchableOpacity>
                        </View>
                    </Modal>
                </View >
                <Fab
                    direction="up"
                    containerStyle={{}}
                    position="bottomLeft"
                    onPress={() => {
                        this.setState({ modalVisible: true });
                    }}
                >
                    <Icon name="md-add" />
                </Fab>
            </View >
        );
    }
}

export default withNavigation(Name);

我对如何处理并使其正常工作一无所知。

setState呼叫can be batched。这意味着如果您多次在相同状态值上调用setState，则输出将不可预测。

在您的示例中，您试图以相同的方法将dataList设置两次。您可以解决此问题，将第二个设置状态包装在回调中：

filter = () => {
  this.setState({ dataList: this.state.fullData }, () => {
    if (this.state.filterName === true) {
      this.setState({ dataList: _.filter(this.state.dataList, { Name: "Samuel" }) });
    }
    if (this.state.filterAge === true) {
      this.setState({ dataList: _.filter(this.state.dataList, ({ age }) => age > 20) });
    }
  });
};

或仅通过一次设置状态：

filter = () => {
  let  = this.state.fullData;
  if (this.state.filterName === true) {
    dataList = { dataList: _.filter(this.state.dataList, { Name: "Samuel" }) };
  }
  if (this.state.filterAge === true) {
    dataList = { dataList: _.filter(this.state.dataList, ({ age }) => age > 20) };
  }

  this.setState({ dataList });
};

本文标签： 在用lodash过滤mongoDB集合数组时如何使用39大于39