Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

[Dúvida] Exibir o conteúdo do arquivo que o usuário acabou de fornecer

Referente ao curso Vue3: composition API e Vuex

por Marcilane De Aguiar Freitas
| 39.8k xp | 19 posts

É possível ler um arquivo do usuário no campo input e depois mostrar esse arquivo clicando em um botão? (no caso estou usando o quasar em cima do vue) Gostaria de mostrar o conteúdo do arquivo (pdf) quando o usuário clicar no botão "VisualizarAquivo". Não faço ideia de como fazer. Vi que v-model retorna um Object File. Alguém poderia me dar uma direção?

//no template <q-file

  label="+ Selecionar Arquivo (pdf)"

  v-model="arqOab"

  accept=".pdf"    

  type="file"

>
<q-btn

  label="Visualizar Arquivo"

  @click="VisualizarAquivo"

  type="button"

/>


// no script

setup() {

const arqOab = ref();

const VisualizarAquivo = () => {

  /// o que eu faço aqui????????

};
2 respostas
por Vinicios Neves
| 992.8k xp | 1088 posts
Instrutor Tech Lead

Olá, Marcilane!

Normalmente pra dúvidas que não estão relacionadas ao curso a galera tem usado muito o Discord.

De qualquer forma, você pode fazer isso mais ou menos desse jeito:

<template>
  <embed v-if="url" :src="url" width="100%" height="500">
  <input type="file" @change="manipularArquivo" accept="application/pdf">
</template>

<script>
export default {
  name: 'App',
  data () {
    return {
      url: null
    }
  },
  methods: {
    manipularArquivo (evento) {
      if (!evento.target.files || !evento.target.files.length) {
        this.url = null
        return
      }
      this.url = URL.createObjectURL(event.target.files[0]);
    }
  }
}
</script>
solução!
por Marcilane De Aguiar Freitas
| 39.8k xp | 19 posts

Boa noite Vinícios, imaginei que seria no Discord, cheguei a me cadastrar e instalar na minha máquina, mas acabei desistindo pois achei muito confuso. Vou tirar um tempo para entender melhor como funciona. Muito obrigada por me responder assim mesmo, estava realmente sem direção.