1. Describa brevemente los tipos de archivos relevantes del programa WeChat Mini.
Respuesta de referencia: hay cuatro tipos de archivos principales en la estructura del proyecto del subprograma WeChat, de la siguiente manera
1. WXML (WeiXin Markup Language) es un conjunto de lenguajes de marcado diseñados por el marco, combinado con los componentes básicos y el sistema de eventos, puede construir la estructura de la página. El interior es principalmente un conjunto de componentes definidos por el propio WeChat.
2. WXSS (WeiXin Style Sheets) es un lenguaje de estilo utilizado para describir estilos de componentes WXML,
Procesamiento lógico 3.js, solicitud de red
4. Configuración del subprograma json, como el registro de la página, el título de la página y la barra de pestañas.
2. ¿Cómo se encapsula la solicitud de datos del subprograma WeChat?
Respuesta de referencia:
1. Coloque todas las interfaces en un archivo js unificado y exporte
2. Cree un método para encapsular datos de solicitud en app.js
3. Llame al método encapsulado para solicitar datos en la subpágina
3. ¿Qué métodos existen para pasar parámetros?
Respuesta de referencia:
1. Agregue el atributo data-* al elemento HTML para pasar el valor que necesitamos y luego obténgalo a través del parámetro param de e.currentTarget.dataset o onload. Pero el nombre de datos no puede tener letras mayúsculas y no puede almacenar objetos.
2. Establezca el ID de método de la identificación para pasar el valor Obtenga el valor de la identificación establecida a través de e.currentTarget.id, y luego pase el valor configurando el objeto global
3. Agregar valor de paso de parámetro en el navegador
4. ¿Qué métodos ha utilizado para mejorar la velocidad de la aplicación de WeChat Mini Programs?
Respuesta de referencia:
1. Mejorar la velocidad de carga de la página
2. Predicción del comportamiento del usuario
3. Reducir el tamaño de los datos predeterminados
4. Esquema de componentes
5. ¿Qué es mejor, mini programa o app nativa?
Respuesta de referencia:
Además del bajo costo de desarrollo de la cuenta oficial, el bajo costo de adquisición de clientes y la no necesidad de descargar, el mini programa se ha mejorado mucho en el retraso de la solicitud de servicio y la experiencia del usuario, lo que lo hace capaz de llevar funciones de servicio complejas y permite a los usuarios obtener una mejor experiencia de usuario
6. Explique brevemente el principio del Mini Programa WeChat.
Respuesta de referencia:
Los applets de WeChat se desarrollan utilizando tres tecnologías: JavaScript, WXML y WXSS. Técnicamente hablando, son similares al desarrollo front-end existente, pero son diferentes cuando profundizan.
JavaScript: en primer lugar, el código JavaScript se ejecuta en la aplicación WeChat, no en el navegador, por lo que algunas aplicaciones de tecnología H5 requieren que la aplicación WeChat brinde el soporte de API correspondiente, lo que limita la aplicación de la tecnología H5 y no se puede llamar H5 estricto. , se puede llamar pseudo H5. De manera similar, algunas API únicas proporcionadas por WeChat no son compatibles con H5 o no muy bien.
WXML: el propio WeChat desarrolla WXML en función de la sintaxis XML, por lo que al desarrollar, solo se pueden usar las etiquetas existentes proporcionadas por WeChat y no se pueden usar las etiquetas HTML.
WXSS: WXSS tiene la mayoría de las funciones de CSS, pero no todas son compatibles y no hay documentación detallada sobre cuáles son compatibles y cuáles no.
La arquitectura de WeChat es un patrón de arquitectura basado en datos. Su interfaz de usuario y los datos están separados, y todas las actualizaciones de la página deben realizarse cambiando los datos.
El applet se divide en dos partes webview y appService. Entre ellos, la vista web se usa principalmente para mostrar la interfaz de usuario y el servicio de aplicaciones se usa para procesar la lógica comercial, los datos y las llamadas de interfaz. Se ejecutan en dos procesos, se comunican a través de la capa del sistema JSBridge y realizan la representación de la interfaz de usuario.
7. ¿Analizar las ventajas y desventajas de los Mini Programas de WeChat?
Respuesta de referencia:
Ventaja:
-
No es necesario descargarlo, puede abrirlo buscando y escaneando.
-
Buena experiencia de usuario: abrir rápidamente.
-
El costo de desarrollo es más bajo que la aplicación.
-
Se puede agregar al escritorio en Android, que es similar a la aplicación nativa.
-
Proporcione a los usuarios una buena protección de seguridad. Para el lanzamiento de programas pequeños, WeChat tiene un proceso de revisión estricto, y los programas pequeños que no pueden pasar la revisión no pueden publicarse en línea.
Desventajas:
-
Más restrictivo. El tamaño de la página no puede exceder 1M. No se pueden abrir páginas con más de 5 niveles.
-
Estilo único. Algunos componentes del applet ya se han formado y el estilo no se puede modificar. Por ejemplo: presentación de diapositivas.navegación.
-
El área de promoción es estrecha, no puede compartir Momentos, solo puede compartirlo con amigos y promocionarlo a través de applets cercanos. Entre ellos, los applets cercanos también están restringidos por WeChat.
-
Confiando en WeChat, es imposible desarrollar funciones de gestión en segundo plano.
8. ¿Cuál es la diferencia entre WeChat Mini Program y H5?
Respuesta de referencia:
La primera es la diferencia en el entorno operativo.
El entorno operativo tradicional de HTML5 es un navegador, incluida la vista web, mientras que el entorno operativo de los applets de WeChat no es un navegador completo, es un analizador incorporado completamente reconstruido por el equipo de desarrollo de WeChat basado en el kernel del navegador, que está especialmente optimizado para applets. , con el lenguaje de desarrollo estándar definido por él mismo, se mejora el rendimiento del applet.
El segundo es la diferencia en los costos de desarrollo.
Solo se ejecuta en WeChat, por lo que no tiene que preocuparse por la compatibilidad del navegador y no tiene que preocuparse por errores inesperados y maravillosos en el entorno de producción.
La tercera es la diferencia en la obtención de permisos a nivel de sistema
Los permisos a nivel del sistema se pueden conectar sin problemas con los applets de WeChat
El cuarto es la fluidez de ejecución de la aplicación en el entorno de producción.
Durante mucho tiempo, cuando las aplicaciones HTML5 se enfrentan a una lógica empresarial compleja o a una interacción de página enriquecida, su experiencia siempre es insatisfactoria y se requiere una optimización constante del proyecto para mejorar la experiencia del usuario. Sin embargo, debido al entorno operativo independiente del subprograma WeChat
9. ¿Cómo resolver el problema de solicitud asíncrona del applet?
Respuesta de referencia:
Llame a la función del siguiente componente en la función de devolución de llamada:
aplicación js
success: function(info) {
that.apirtnCallback(info)
}
índice. js
onLoad: function() {
app.apirtnCallback = res => {
console.log(res)
}
}
10. ¿Cuál es la diferencia entre el enlace bidireccional del applet y vue?
Respuesta de referencia: las propiedades de this.data directamente en el applet no se pueden sincronizar con la vista y se deben llamar
this.setData({
noBind: true
})
11. ¿Cuáles son las diferencias entre wxss y css en applets?
Respuesta de referencia:
1. La importación de imágenes de wxss necesita usar la dirección del enlace externo;
2. Sin cuerpo, los estilos se pueden importar directamente usando importar;
12. ¿Cómo vuelven las páginas de la vista web al subprograma?
Respuesta de referencia: Primero, introduzca la última versión de jweixin-1.3.2.js, y luego
wx.miniProgram.navigateTo({
url: '/pages/login/login' + '$params'
})
13. ¿Cómo determinar la unicidad del usuario cuando el Programa Mini está asociado a la Cuenta Oficial de WeChat?
Respuesta de referencia: use el método wx.getUserInfo con Credenciales para obtener los datos cifrados, que contienen union_id. El backend necesita realizar un descifrado simétrico
14. ¿Cómo implementar la actualización desplegable?
Respuesta de referencia: use la vista en lugar de la vista de desplazamiento, configure la función onPullDownRefresh para lograr
15. ¿A qué se debe prestar atención cuando se usa webview para cargar directamente?
Respuesta de referencia:
1. Debe usar el administrador para agregar el nombre de dominio comercial en el fondo del applet;
2. El script para que la página h5 salte al subprograma debe ser 1.3.1 o superior;
3. El uso compartido de WeChat solo puede ser el nombre principal del mini programa. Si desea personalizar el contenido compartido, la versión del mini programa debe ser superior a 1.7.1;
4. El pago de h5 no puede ser el appid de la cuenta oficial de WeChat, debe ser el appid del applet, y el openid del usuario también debe ser el usuario y el applet.
16. ¿Qué problemas encuentran los applets al llamar a la interfaz de fondo?
Respuesta de referencia:
1. El tamaño de los datos es limitado, exceder el límite provocará directamente que todo el subprograma se bloquee a menos que se reinicie el subprograma;
2. El subprograma no puede representar directamente el contenido de texto html de la página de contenido del artículo. Si necesita mostrarlo, debe usar el complemento, pero la representación del complemento ralentizará la carga de la página, por lo que es mejor filtrar el html del contenido del artículo en segundo plano. Procese directamente el reemplazo masivo de etiquetas p y etiquetas div para ver etiquetas, y luego deje que el complemento haga otras etiquetas para reducir el tiempo en la interfaz.
17. ¿Cómo salta la página webview a la página de navegación del subprograma?
Respuesta de referencia: se puede acceder a la página navegada por el applet a través de switchTab, pero los datos no se recargarán de forma predeterminada.
Si necesita cargar nuevos datos, simplemente agregue el siguiente código al atributo de éxito:
success: function(e) {
var page = getCurrentPages().pop();
if (page == undefined || page == null) return;
page.onLoad();
}
página webview, a través de
wx.miniProgram.switchTab({
url: '/pages/index/index'
})
18. ¿Cuál es la diferencia entre los programas pequeños y Vue?
Respuesta de referencia:
1. Al hacer un bucle: el applet es wx:for="list", mientras que Vue es v-for="(item, index) in list"
2. Al llamar al modelo de datos: el subprograma es this.data.uinfo y Vue es this.uinfo, la asignación al modelo también es diferente, el subprograma es this.setData({uinfo:1}) y Vue es directamente este .uinfo=1
19. Ciclo de vida del miniprograma
Respuesta de referencia:
// app.js
App({
onLaunch(options) {
// Do something initial when launch.
},
onShow(options) {
// Do something when show.
},
onHide() {
// Do something when hide.
},
onError(msg) {
console.log(msg)
},
globalData: 'I am global data'
})
//index.js
Page({
data: {
text: "This is page data."
},
onLoad: function(options) {
// 页面创建时执行
},
onShow: function() {
// 页面出现在前台时执行
},
onReady: function() {
// 页面首次渲染完毕时执行
},
onHide: function() {
// 页面从前台变为后台时执行
},
onUnload: function() {
// 页面销毁时执行
},
onPullDownRefresh: function() {
// 触发下拉刷新时执行
},
onReachBottom: function() {
// 页面触底时执行
},
onShareAppMessage: function () {
// 页面被用户分享时执行
},
onPageScroll: function() {
// 页面滚动时执行
},
onResize: function() {
// 页面尺寸变化时执行
},
onTabItemTap(item) {
// tab 点击时执行
console.log(item.index)
console.log(item.pagePath)
console.log(item.text)
},
// 事件响应函数
viewTap: function() {
this.setData({
text: 'Set some data for updating view.'
}, function() {
// this is setData callback
})
},
// 自由数据
customData: {
hi: 'MINA'
}
})
[Falló la transferencia de imagen del enlace externo, el sitio de origen puede tener un mecanismo anti-leeching, se recomienda guardar la imagen y cargarla directamente (img-mNUAtpcs-1675613277237) (.../images/miniProgram_001.png)]
20. ¿Cómo pasa parámetros la página h5 al applet?
Respuesta de referencia:
1、H5页面
<script src="${base}/resources/common/js/jweixin.miniProgram.js"></script>
wx.miniProgram.postMessage({
data: {
shareUrl:href
}
});
注意：传参必须使用data
2、小程序页面接收
Page({
//获取H5传给小程序的参数
getMessage: function(e) {
if (!e.detail) {
return
}
var datas = e.detail.data
var shareUrl = datas.shareUrl;
}
})
index.wxml文件