反应本地博览会错误未定义不是对象正在评估item.basicData.criminalName

问题描述

const SearchContext = React.createContext();
class SearchProvider extends Component {
  state = {
    tfG: false,aboutToSearch: "criminals",};

  render() {
    return (
      <SearchContext.Provider
        value={{
          state: this.state,changeAboutToSearch: (value) => {
            if (value == true) {
              console.log(value);
              this.setState({ aboutToSearch: "gangNames",tfG: true });
            } else {
              this.setState({ aboutToSearch: "criminals",tfG: false });
            }
          },}}
      >
        {this.props.children}
      </SearchContext.Provider>
    );
  }
}
class SearchBox extends Component {
  render() {
    return (
      <SearchContext.Consumer>
        {(context) => (
          <>
            <View
              style={{
                marginTop: 30,alignItems: "center",justifyContent: "center",}}
            >
              <View style={{ flexDirection: "row" }}>
                <View>
                  <Text>{context.state.tfG ? "Gangs" : "Criminals"}</Text>
                  <Switch
                    onValueChange={context.changeAboutToSearch}
                    value={context.state.tfG}
                  />
                </View>
                <Item rounded style={{ width: "65%" }}>
                  <Label style={{ textAlign: "right",fontWeight: "bold" }}>
                    <AntDesign name="search1" size={24} color="black" />
                  </Label>
                  <Input
                    onChangeText={(query) => {
                      this.props.refine(query);
                    }}
                    placeholder={"Search Criminals/Gangs"}
                    placeholderTextColor={"black"}
                    clearButtonMode={"always"}
                    clearButtonMode={"always"}
                    spellCheck={false}
                    autoCorrect={false}
                    autoCapitalize={"none"}
                  />
                </Item>
              </View>
            </View>
          </>
        )}
      </SearchContext.Consumer>
    );
  }
}
const ConnectedSearchBox = connectSearchBox(SearchBox);
class InfiniteHits extends Component {
  onEndReached = () => {
    if (this.props.hasMore) {
      this.props.refine();
    }
  };
  render() {
    return (
      <SearchContext.Consumer>
        {(context) => (
          <>
            <FlatList
              renderItem={({ item }) => (
                  {context.state.tfG ? (
                    
                      
                            <Text>{item.addGang}</Text>
                          
                  ) : (
                
                     
                            <Text>{item.basicData.criminalName}</Text>
                    
                  )}
              )}
              data={this.props.hits}
              keyExtractor={(item) => item.objectID}
              onEndReached={this.onEndReached}
            />
          </>
        )}
      </SearchContext.Consumer>
    );
  }
}
const ConnectedInfiniteHits = connectInfiniteHits(InfiniteHits);
export default class InitialDb extends Component {
  constructor(props) {
    super(props);
    this.state = {
      Gangs: "",criminals: "",loading: false,};
  }
  render() {
    const searchClient = algoliasearch(
      "asdf","asdf"
    );
    return (
      <SearchProvider>
        <SearchContext.Consumer>
          {(context) => (
            <>
              <SafeAreaView>
                <BackButton />
                <View>
                  <InstantSearch
                    searchClient={searchClient}
                    indexName={context.state.aboutToSearch}
                  >
                    <ConnectedSearchBox />
                    <ConnectedInfiniteHits />
                  </InstantSearch>
                </View>
              </SafeAreaView>
            </>
          )}
        </SearchContext.Consumer>
      </SearchProvider>
    );
  }
}

在上面的代码中，在SearchProvider类中，我将其用作上下文提供者类（Context API），在SearchBox类中，将其用作搜索算法搜索，在InfiniteHits类中，我正在使用以显示结果。在InitialDb类中，我正在渲染所有内容。在这里我在阿尔及利亚索引中有2个集合，它们具有不同类型的对象（帮派名称和犯罪分子）。我想根据打开或关闭来填充它。如果启用，则将填充gangNames Index对象；如果禁用，则将填充罪犯索引。默认情况下它是Off（将填充false / criminals索引），如果我将其打开（true），则将获取gangNames索引，但是如果我再次将其切换为Off（falses，则将显示criminals索引）收到“未定义不是对象错误” Here Im attaching the screenshot,This is the error what I'm getting

解决方法

很可能item.basicData不是对象，并且您正在尝试访问非对象的属性。您可以尝试使用：item.basicData && item.basicData.criminals或item.basicData?.criminals是否可用。