0

Como posso fazer para que quando o "titulo" da tarefa for selecionado através do Picker ele preencher meus outros campos pertencentes a essa tarefa e conseguir atualizar meus dados? agradeço pela ajuda ;)

export default class atualizaranuncio extends Component {

  constructor() {
    super();
    this.state = {
      status: '',
      titulo: [],
      titulo_selecionado: ""
    };
    firebase.auth().onAuthStateChanged((user) => {
      if (user) {
        firebase.database().ref('Tarefas').child(user.uid).once('value', (snapshot) => {
          let state = this.state;
          state.titulo = [];

          snapshot.forEach((childItem) => {
            state.titulo.push({
              key: childItem.key,
              titulo: childItem.val().titulo
            });
          });
          this.setState(state);
        });
      }
    });
  }

  render() {
    return (
      <View style={styles.container}>

        <Text style={styles.logoText}>Atualizar o Anuncio</Text>
        <Text>{'\n'}</Text>
        <Text style={styles.texto}>Titulo do Anuncio:</Text>
        <Picker
          selectedValue={this.state.titulo_selecionado}
          style={styles.picker}
          onValueChange={(itemValue, itemIndex) => this.setState({ titulo_selecionado: itemValue })}>
          {this.state.titulo.map((item, index) => {
            return (
              <Picker.Item label={item.titulo} value={item.titulo} key={index}/>
            );
          })}
        </Picker>
        <Text style={styles.texto}>Descrição do Anuncio:</Text>
        <TextInput style={styles.inputBox}
          underlineColorAndroid='rgba(0,0,0,0)'
          placeholder="Descrição"
          placeholderTextColor="#ffffff"
          selectionColor="#fff"
        />
        <Text style={styles.texto}>Valor do Anuncio:</Text>
        <TextInput style={styles.inputBox}
          underlineColorAndroid='rgba(0,0,0,0)'
          placeholder="R$0000,00"
          placeholderTextColor="#ffffff"
          selectionColor="#fff"
          keyboardType="number-pad"
        />
        <Text style={styles.texto}>Status:</Text>
        <Picker
          selectedValue={this.state.status}
          style={styles.picker}
          onValueChange={(itemValue, itemIndex) =>
            this.setState({ status: itemValue })
          }>
          <Picker.Item label="Não realizado" value="1" />
          <Picker.Item label="Realizado" value="0" />
        </Picker>
        <TouchableOpacity style={styles.button}>
          <Text style={styles.buttonText}>Atualizar Anuncio</Text>
        </TouchableOpacity>

      </View>
    );
  }
}

1 Resposta 1

1

Como não conheço o retorno do seu objeto "Tarefas", eu estou supondo que ele tenha o status, descrição e valor

Com base nisso, as alterações seriam as seguintes:

1 - Acrescentar descrição e valor no state

2 - Na hora de fazer o loop para montar o array titulo, adicionar as novas informações.

3 - No onValueChange do picker Titulo foi acrescentada uma função que recebe como parâmetro o que foi selecionado. A função verifica no array titulo e quando localiza o registro, atualiza o state.

4 - Para que os TextInput recebam os dados do state, foi usada a propriedade value.

Seu código ficaria da seguinte forma:

export default class atualizaranuncio extends Component {
  
  constructor() {
    super();
    this.state = {
      status: '',
	  descricao: '',
	  valor: '',
      titulo: [],
      titulo_selecionado: ""
    };
    firebase.auth().onAuthStateChanged((user) => {
      if (user) {
        firebase.database().ref('Tarefas').child(user.uid).once('value', (snapshot) => {
          let state = this.state;
          state.titulo = [];

          snapshot.forEach((childItem) => {
            state.titulo.push({
              key: childItem.key,
              titulo: childItem.val().titulo,
			  status: //Adicionar o campo,
			  descricao: //Adicionar o campo,
			  valor: //Adicionar o campo,
            });
          });
          this.setState(state);
        });
      }
    });
  }
  
  RetornarDadosAnuncio = (titulo) => {
	this.state.titulo.map((item, index) => {
		if (item.titulo == titulo){
			//Atualizar os campos do formulario
			this.setState(titulo_selecionado: titulo, status: item.status, descricao: item.descricao, valor: item.valor);
        } 
      }  
   } 

  render() {
    return (
      <View style={styles.container}>

        <Text style={styles.logoText}>Atualizar o Anuncio</Text>
        <Text>{'\n'}</Text>
        <Text style={styles.texto}>Titulo do Anuncio:</Text>
        <Picker
          selectedValue={this.state.titulo_selecionado}
          style={styles.picker}
          onValueChange={(itemValue, itemIndex) => this.RetornarDadosAnuncio(itemValue)}>
          {this.state.titulo.map((item, index) => {
            return (
              <Picker.Item label={item.titulo} value={item.titulo} key={index}/>
            );
          })}
        </Picker>
        <Text style={styles.texto}>Descrição do Anuncio:</Text>
        <TextInput style={styles.inputBox}
          underlineColorAndroid='rgba(0,0,0,0)'
          placeholder="Descrição"
          placeholderTextColor="#ffffff"
          selectionColor="#fff"
		  value={this.state.descricao}
        />
        <Text style={styles.texto}>Valor do Anuncio:</Text>
        <TextInput style={styles.inputBox}
          underlineColorAndroid='rgba(0,0,0,0)'
          placeholder="R$0000,00"
          placeholderTextColor="#ffffff"
          selectionColor="#fff"
          keyboardType="number-pad"
		  value={this.state.valor}
        />
        <Text style={styles.texto}>Status:</Text>
        <Picker
          selectedValue={this.state.status}
          style={styles.picker}
          onValueChange={(itemValue, itemIndex) =>
            this.setState({ status: itemValue })
          }>
          <Picker.Item label="Não realizado" value="1" />
          <Picker.Item label="Realizado" value="0" />
        </Picker>
        <TouchableOpacity style={styles.button}>
          <Text style={styles.buttonText}>Atualizar Anuncio</Text>
        </TouchableOpacity>

      </View>
    );
  }
}

3
  • Está funcionando, porem ele n troca o Picker de Status que no banco é 1 ou 0, como faço pra ele trazer o Picker certo?(pq eu deixo ele com value 1 e 0 pq creio q vá pro banco com esse valor, então como exibir o certo e ao msm tempo manter pra quando eu clicar atualizar ele funcionar?), mas desde já agradeço sua ajuda!! você manja d+!!
    – Nuck
    Commented 20/04/2019 às 4:38
  • Se o problema é apenas no picker de status, e se você está recebendo o valor na hora de montar o array de título, eu acho que o problema deve ser o formato. Tente primeiro converter o valor para inteiro (status: parseInt(seu campo)). Se o erro persistir, tente converter para string (status: String(seu campo))
    – Bins
    Commented 20/04/2019 às 14:28
  • Muito Obrigado!!!! <3
    – Nuck
    Commented 20/04/2019 às 20:11

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .