O aplicativo implementa o processo de troca de avatares na página de login

1. Exigir:

Na operação de login do APP, o avatar pode ser personalizado e carregado de acordo com as necessidades do usuário

2. Análise: Pilha de tecnologia

  1. . Familiarizado com o layout do terminal móvel em, rem e flex

  2. .Mestre o Javascipt nativo

  3. Domine o método de solicitação axios

3. Processo:

  1. Faça upload de uma foto existente ou tire uma foto
  2. Escolha a imagem e defina a imagem
  3. Atualizar foto

4. Análise do projeto:

1. Formulário de upload de arquivo:

<input type="file" accept="image/*" capture="camera" >

a.type = "arquivo" formulário de upload de arquivo
b. accept = "imagem / *" upload de tipo de arquivo
c.capture = "câmera" usar câmera de celular para fotografar

2. O parâmetro de solicitação é do tipo FormData

new FormData()

let formData = new FormData()          formData.append('file', e.target.files[0])

1. Carregar arquivo (carregar em formato binário)
2. Enviar formulário
3. Aprender sobre a interface

  1. Upload de fotos: interface de url e método de solicitação

2. Obtenha o URL e o método de solicitação das fotos enviadas

3. Obtenha o URL e o método de solicitação para exibir as informações do usuário

4. Normalmente, as solicitações de "axios" são divididas em "GET" e "POST", há também uma "solicitação de método put"

axios.put(url,{
    
    }).then(res => {
    
    })

Configurar interceptação de solicitação

axios.interceptors.request.use(function (config) {
    
    
    //在发送之前做些什么
    return config;
}, function (error) {
    
    
    // 对请求错误做些什么
    return Promise.reject(error);
});

Resumo: O exemplo acima é uma ideia de processo para um aplicativo alternar o avatar na página de login. Implemente-o em conjunto com a API.

Bem-vindo ao se juntar ao grupo para discussões técnicas, número do grupo: 954314851

Insira a descrição da imagem aqui

Acho que você gosta

Origin blog.csdn.net/weixin_48193717/article/details/108268204
Recomendado
Clasificación