反应本机搜索函数不渲染

Question

我有两个没有渲染的函数：renderTeachers()和renderSubjects()。它们根据状态对象中教师数组的长度进行呈现。我控制台登录了state.teachers，结果符合预期，数组长度不止一个，但函数仍然没有呈现。我不明白为什么这些函数没有渲染。

class Search extends Component {
  state = {
    teachers: [],
    subjects: [],
    rating: 3.5,
  };
  requestData = (queryObj) => {
    console.log(queryObj);
    const client = algoliasearch('__ID__', '__KEY__');
    const queries = [{
      indexName: 'teachers',
      query: queryObj,
      filters: 'Rating >= 3.5',
    }, {
      indexName: 'subjects',
      query: queryObj,
    }];
    if (queryObj === '') {
      this.setState({ showSearchVal: false });
    } else {
      client.search(queries, this.searchCallback.bind(this));
    }
  }
  searchCallback = (err, content) => {
    if (err) {
      console.error(err);
      return;
    }
    this.setState({ teachers: content.results[0].hits, subjects: content.results[1].hits });
  }
  renderSubjects = () => {
    if (this.state.subjects.length >= 1) {
      return this.state.subjects.map(subject => <SubjectDetail key={subject.objectID} subject={subject} />);
    }
    return null;
  }
  renderTeachers = () => {
    console.log('in');
    if (this.state.teachers.length >= 1) {
      return this.state.teachers.map(teacher => <SearchDetail key={teacher.UID} person={teacher} />);
    }
    return null;
  }
  render() {
    return (
      <View>
        <Header search onPress={() => this.searchBar.show()} />
        <SearchBar
          backgroundColor='#02254e'
          iconColor='#4f5d6d'
          placeholderTextColor='#4f5d6d'
          backButton={<Icon name='keyboard-backspace' size={24} color='#4f5d6d' style={{ alignSelf: 'center' }} />}
          textColor='white'
          animate={false}
          handleChangeText={this.requestData}
          selectionColor='#01152d'
          fontFamily='avenir_heavy'
          backCloseSize={24}
          ref={(ref) => { this.searchBar = ref; }}
        />
        <View style={{ width, height, alignItems: 'center', flex: 1 }}>
          <ScrollView style={{ flex: 1 }}>
            <Text style={styles.topResultTextStyle}>
              {this.state.subjects.length >= 1 ? 'Subjects' : ''}
            </Text>
            {this.renderSubjects()}
            <Text style={styles.topResultTextStyle}>
              {this.state.teachers.length >= 1 ? 'Teachers' : ''}
            </Text>
            {this.renderTeachers()}
          </ScrollView>
        </View>
      </View>
    );
  }
}
export { Search };

Answer 1

从您发布的代码中，我看不出教师/科目不渲染的原因。我的问题是，您如何设置教师/科目数组？在不更改状态/道具的情况下，反应组件不应该渲染。你能分享数组设置代码吗？