0

我有一个领域数据库同步了。该数据库包含具有类别和公司名称的多个产品。有些产品具有相同的公司名称,有些产品具有相同的类别名称,有些产品除了 id 之外的所有内容都相同。我需要做的是制作一个浏览组件,用户可以在其中浏览公司名称。我创建了一个自动完成搜索。搜索应自动完成公司名称显示屏幕中的产品类别。我现在面临的是自动完成搜索多次显示相同的公司名称(对于数据库中的每个产品)。此外,我只需要渲染一次具有相同名称的类别。

浏览屏幕

这是我的数据库架构:

import Realm from 'realm';
import axios from 'axios';

class Product extends Realm.Object {}
Product.schema = {
  name: 'Product',
  properties: {
    cname: 'string',
    pname: 'string',
    id: 'int',
    price: 'string',
    code: 'string',
    category: 'string',
  },
  primaryKey: 'id',
};

let getAllProducts = () => {
  return realm.objects('Product');
};
export {getAllProducts}

浏览屏幕:

import React, {useEffect, useState} from 'react';
import {
  StyleSheet,
  View,
  SafeAreaView,
  Text,
  FlatList,
  TouchableWithoutFeedback,
  Alert,
} from 'react-native';
import {Searchbar, RadioButton} from 'react-native-paper';
import {
  ApplicationProvider,
  Button,
  Icon,
  IconRegistry,
  Layout,
  Card,
} from '@ui-kitten/components';
import {EvaIconsPack} from '@ui-kitten/eva-icons';
import * as eva from '@eva-design/eva';
import {getAllProducts, addProduct, deleteAllProduct} from '../database/realm';
import {Autocomplete, AutocompleteItem} from '@ui-kitten/components';
import TextTicker from 'react-native-text-ticker';

const filter = (item, query) =>
  item.cname.toLowerCase().includes(query.toLowerCase());

const StarIcon = props => <Icon {...props} name="star" />;

export default function browse() {
  const [value, setValue] = React.useState(null);
  const [data, setData] = React.useState(getAllProducts());
  const onSelect = index => {
    setValue(data[index].cname);
  };
  const onChangeText = query => {
    setValue(query);
    setData(getAllProducts().filter(item => filter(item, query)));
  };
  const clearInput = () => {
    setValue('');
    setData(getAllProducts());
  };
  const renderOption = (item, index) => (
    <AutocompleteItem key={index} title={item.cname} />
  );
  const renderCloseIcon = props => (
    <TouchableWithoutFeedback onPress={clearInput}>
      <Icon {...props} name="close" />
    </TouchableWithoutFeedback>
  );

  useEffect(() => {
    console.log('company selected:', value);
  });

  function CnameValue() {
    return getAllProducts().filtered('cname == $0', value);
  }
  return (
    <SafeAreaView>
      <Autocomplete
        placeholder="Type company name"
        value={value}
        accessoryRight={renderCloseIcon}
        onChangeText={onChangeText}
        onSelect={onSelect}>
        {data.map(renderOption)}
      </Autocomplete>
    </SafeAreaView>
  );
}
4

1 回答 1

0

我认为您正在寻找的是DISTINCT过滤器。在您的示例中,它将类似于

getAllProducts().filtered('cname == $0 DISTINCT(cname)', value);

该文档目前可在此处获得:

https://docs.mongodb.com/realm-legacy/docs/javascript/latest/#filtering

相关部分是:使用函数SORT和可以排序和查找不同的值DISTINCT,例如age > 20 SORT(name ASC, age DESC) DISTINCT(name)

于 2021-09-06T11:19:47.650 回答