Ainda não tem acesso? Estude com a gente! Matricule-se
Ainda não tem acesso? Estude com a gente! Matricule-se

Solucionado (ver solução)

erro .length

crie a variavel likers no state, pois nao estou consumindo a mesma api da aula, ate ae tudo bem, mas quando uso o .length retorna o seguinte erro:

TypeError: undefined is not an object (evaluating 'foto.likers.length') This error is located at: in Post (at App.js:56) in RCTView (at View.js:35) in View (at VirtualizedList.js:1770) in CellRenderer (at VirtualizedList.js:688) in RCTScrollContentView (at ScrollView.js:1007) in RCTScrollView (at ScrollView.js:1147) in ScrollView (at VirtualizedList.js:1081) in VirtualizedList (at FlatList.js:634) in FlatList (at App.js:52) in App (at renderApplication.js:40) in RCTView (at View.js:35) in View (at AppContainer.js:98) in RCTView (at View.js:35) in View (at AppContainer.js:115) in AppContainer (at renderApplication.js:39)
5 respostas

meu codigo


import React, { Component } from 'react';

import { 
  Platform,
  StyleSheet,
  Text,
  View,
  Image,
  Dimensions,
  ScrollView,
  FlatList,
  TouchableOpacity,
 } from 'react-native';


// import { Container } from './styles';
const width = Dimensions.get('screen').width;
export default class Post extends Component {

  constructor(props){
    super(props)
    this.state = {
      foto: props.foto,
      likeada: false,
      likers: 0,
    }
  }

  like(){
    const like = this.state.likeada
    // const fotoLike = {
    //   ...this.state.likeada,
    //   likeada: !this.state.likeada 
    // } 

    this.setState({ likeada: !like })


    // this.setState({ likeada: fotoLike })
    // console.warn(this.state.likeada)
    // console.warn(this.fotoLike)

  } 

  carregaIcone(like){
    return like ? require('../../resources/img/s2-checked.png') :
      require('../../resources/img/s2.png')
  }

  render() {
    const { foto } = this.state;
    return (
      <View>
        <View style={styles.cabecalho}>
          <Image source={{ uri: foto.image }}
            style={styles.fotoDePerfil}
          />
          <Text> {foto.name} </Text>
        </View>
        <Image source={{ uri: foto.image }}
          style={styles.foto}
        />
        <View style={styles.rodape}>
          <TouchableOpacity onPress={this.like.bind(this)}>
            <Image source={this.carregaIcone(this.state.likeada) } 
              // require('../../resources/img/s2.png')
                style={ styles.btnLike }
              />
          </TouchableOpacity>

          <Text style={styles.likes}>
            {foto.likers.length} curtidas
          </Text>

        </View>
      </View>


    )
  }
}
const styles = StyleSheet.create({
  cabecalho: {
    margin: 10,
    flexDirection: 'row',
    alignItems: 'center'
  },
  fotoDePerfil: {
    marginRight: 10,
    borderRadius: 20,
    width: 40, height: 40
  },
  foto: {
    width: width,
    height: width
  },
  btnLike: {
    width: 35,
    height: 35,
    marginBottom: 10
  },
  rodape:{
    margin: 15
  },
  likes:{
    fontWeight: 'bold'
  }


});

Renato, boa tarde!

Verifique se o tanto o foto quanto o likers existem fazendo um console log, em ambos, pois algum deles está undefined

Renato,

Veja se consegue com o código que eu coloquei neste tópico.

Tem o index.js, App.js e Post.js do final da aula 3, mas mesclando com a nova estrutura (sem index para cada plataforma).

Essas variáveis que ele usa (likeada, likers, etc) estão no JSON disponibilizado no servidor. Mais ou menos isso:

0    
urlPerfil    "https://olhardigital.com.br/uploads/acervo_imagens/2015/02/r16x9/20150219125722_1200_675.jpg"
loginUsuario    "rafael"
horario    "01/09/2019 14:39"
urlFoto    "https://www.fatosdesconhecidos.com.br/wp-content/uploads/2018/02/thomas-edison-1.jpg"
id    3
likeada    false
likers    []
comentarios    []
comentario    "Wow que legal!"
solução

Pelo que eu vi do seu código, no seu state, "likers" está recebendo um valor inteiro. O código {foto.likers.length} somente vai funcionar se "likers" for um array (likers: [])

Daniel era isso mesmo, obrigado!