Реакция native - наличие статических и динамических элементов в FlatList

Ketan Malhotra спросил: 13 июня 2018 в 07:48 в: javascript

Я пытаюсь создать FlatList, например, как список Twitter Twitter, отображающий параметры, начиная от Camera to Photos в Галерее устройства.

Я не уверен, как иметь первые 2-3 элемента в качестве статических элементов, а затем добавлять динамические элементы через CameraRoll или что-то в этом роде.

Первое решение, которое мне пришло в голову, состояло в том, что у него был массив с его первыми 2-3 элементами в виде текста, содержащего "Камера", "Галерея" и т. д., а затем объединить этот массив с динамический массив и обрабатывать все с помощью функции renderItem () для отображения другого представления для случая "статического элемента". Но я надеюсь, что для этого будет лучший способ. Пожалуйста, помогите мне с этим.


1 ответ

Есть решение
Tholle ответил: 13 июня 2018 в 09:59

Я думаю, что лучший и самый простой вариант - сделать это так, как вы начертили: объединить "статический" массив с "динамическим" массивом и обработать статические отдельно.

Пример

class Options extends React.Component {
  renderItem({ item, index }) {
    if (index === 0) {
      return <Camera />;
    } else if (index === 1) {
      return <Live />;
    } else {
      return <GeneralItem {...item} />;
    }
  }  render() {
    const statics = [{ text: 'Camera' }, { text: 'Live' }];    return (
      <FlatList
        data={statics.concat(this.props.data)}
        renderItem={this.renderItem}
      />
    );
  }
}
Ketan Malhotra ответил: 14 июня 2018 в 06:56
Я действительно хочу, чтобы был правильный способ сделать это, потому что это было для меня способом. Тем не менее, большое спасибо! :)

Дополнительное видео по вопросу: Реакция native - наличие статических и динамических элементов в FlatList

Going Over The Speed Limit: Synchronous Rendering in React Native

Что такое React Native. Мобильные приложения на React.

React JS Crash Course - 2019