Problemas comuns e soluções para o rápido desenvolvimento de aplicativos [Atualização contínua]

Estou em contato com os aplicativos há um tempo. Subi nos grandes e pequenos buracos e me deixe viver até hoje. Prepare-se para publicar atualizações contínuas aqui, registre os problemas encontrados e as soluções para o benefício do público.

aspecto css

1. O texto vertical não suporta

No momento, o funcionário não suporta o modo de gravação.Além de esperar pelo suporte oficial dessa API, você também pode usar um hack: defina uma largura relativamente pequena para o elemento.

2. alinhamento de texto: centro; centro inválido

Como o aplicativo rápido é padronizado para o layout flexível, o justify-content: center deve ser usado quando centralizado;

aspecto do modelo

1. Depois de usar o componente da lista, a página inteira não pode ser rolada

O componente da lista precisa adicionar "scrollpage = true". https: //doc.quickapp.cn/widge ...

2. O componente da lista desliza para frente e para trás sem nenhum motivo. Desculpe, "O Aplicativo Rápido" parou de ser executado.

Provavelmente, isso é causado por uma estrutura de arquivo diferente no item de lista

<list-item>
 <div if={{item.img}}>
   <image src='{{item.img}}'>
 </div>
 <div else>
   <text>{{item.text}}</text>
 </div>
</list-item>

O mesmo tipo de item de lista deve ter uma estrutura DOM completamente consistente.A estrutura dom do item de lista no exemplo acima será alterada e deve ser possível usar dois tipos diferentes de itens de lista.

<list-item type="img" if={{item.img}}>
 <div>
   <image src='{{item.img}}'>
 </div>
</list-item>
<list type="text" else>
 <div>
   <text>{{item.text}}</text>
 </div>
</list-item>

3. Não posso alterar o estilo do fragmento HTML inserido pelo richtext? Às vezes, a imagem está além da borda da tela

Como não há interface oficial para modificar o estilo do richtext, um método que atualmente pode ser usado é usar a pesquisa regular para corresponder e, em seguida, adicionar o estilo, quando necessário

4. O componente da lista às vezes falha ao renderizar

Demorei muito tempo para resolver este problema. Este é um bug conhecido do aplicativo Kuai.
Este problema não pode ser processado quando a lista é usada na terceira camada.

<template>
<div>
  <div>
    <list>
    ...
    </list>
  </div>
</div>
</template>

Solução: Altere para div ou não a coloque na terceira camada.

aspecto js

1, storage.get definir variável com sucesso sem resposta

var a;
storage.get({
  key: 'a',
  success: function (data) {
    a = data;
  }
})
console.log(a) //undefined 

O motivo é que o armazenamento é assíncrono.

Outros

1. Como conseguir o efeito de tela cheia

Defina a exibição no arquivo de configuração manifest.json, "fullScreen": false, para ocultar a barra de status da bateria do sinal da bateria; "titleBar": false; para ocultar o titleBar. Isso tornará a tela cheia.

2. Após a atualização do projeto, a imagem de fundo se torna um fundo branco

A imagem de plano de fundo usa um caminho relativo, e o projeto trata um pouco do caminho relativo, alterando-o temporariamente para um caminho absoluto.

3. O comando hap não pode ser encontrado após a instalação do Windows

Provavelmente, isso ocorre porque o diretório de instalação do npm não possui variáveis ​​de ambiente configuradas.

npm prefix -g 
// 会打印一个出一个路径，将它添加进系统变量中
// 再次运行
npm install -g hap-toolkit

Referência:
aplicação rápida de poços de mineração e layout flexível para explicar
documentos de desenvolvimento