Реагировать на объект Firebase Native Pass на следующую страницу - Реагировать с навигацией - PullRequest
Новая
       25

Реагировать на объект Firebase Native Pass на следующую страницу - Реагировать с навигацией

0 голосов
/ 07 декабря 2018

У меня есть список объектов Firebase в React Native ListView.Пожалуйста, смотрите код ниже.

Импорт данных из Firebase: 

getDataForFeed() {

    var feedPosts = this;

    firebase
      .database()
      .ref("/feedPosts/")
      .limitToLast(10)
      .orderByChild('sortingTime')
      .on("child_added", function(data) {
      var newData = [...feedPosts.state.listViewData];
      newData.push(data);
      feedPosts.setState({ listViewData: newData });
    });
}

Рендеринг данных: 

<ListView

   enableEmptySections
   dataSource={this.ds.cloneWithRows(this.state.listViewData)}

   renderRow={data => (

   <Card style={{ flex: 0 }}>

       <CardItem
       button
       onPress={data => {
       this.props.navigation.navigate("ViewPost", {
       subject: data.val().subject //This doesn't work.
      });
     }}
    >

      <Body>
         <Text small>
            {data.val().subject} //This works.
         </Text>
      </Body>

     </CardItem>

   </Card>
  )}
/>

Когда я помещаю строку или целое число в ""субъект", работает нормально, но когда мне нужно нужное мне значение, data.val (). предмет - выдает эту ошибку. 

data.val is not a function.

В текстовом поле ниже data.val ().subject показывает очень хорошо.

Пожалуйста, помогите мне перевести это в правильный формат, чтобы я перенес его на следующую страницу.

1 Ответ

0 голосов
/ 10 декабря 2018

Хорошо.Вот как я это сделал:

Я ввел данные следующим образом: 

getDataForFeed() {

var feedPosts = this;

firebase
  .database()
  .ref("/feedPosts/")
  .limitToLast(10)
  .orderByChild('sortingTime')
  .on("child_added", function(data) {
  var newData = [...feedPosts.state.listViewData];
  newData.push(data);
  feedPosts.setState({ listViewData: newData });
});
}

Я сделал отдельную функцию renderRow вместо встроенного: 

renderRow(data) {
    const { navigate } = this.props.navigation;

    return (
      <Card style={{ flex: 0 }}>
        <CardItem
          button
          onPress={() => {
            navigate("ViewPost", data.val());
          }
            }
          bordered
        >
        </CardItem>
      </Card>
    );
  }

Затем я отобразил список следующим образом: 

<ListView
   enableEmptySections
   dataSource={this.ds.cloneWithRows(this.state.listViewData)}
   renderRow={this.renderRow.bind(this)}
/>

Затем на следующей странице доступ к данным осуществляется следующим образом: 

console.log(this.props.navigation.state.params, "Navigation");

Надеюсь, это поможет.Прокомментируйте, если вам нужны какие-либо разъяснения.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...