Continuación del artículo anterior:https://developer.huawei.com/consumer/cn/forum/topicview?tid=0202356376262560775&fid=0101303901040230869
Dirección del almacén del código fuente:https://gitee.com/zhaoquan/harmonyoswatchdemo
Agregue un botón a la página de inicio y responda a los eventos de clic
<!-- index.hml -->
<div class="container">
<text class="title">
Hello {{title}}
</text>
<input type="button" class="btn" value="点我" onclick="clickAction"></input>
</div>Agregue al código predeterminado generado cuando la página se crea en index.hml: <input type = "button" class = "btn" value = "点 我" onclick = "clickAction"> </input>
/*index.css*/
.container {
flex-direction: column;
/* display: flex;*/
justify-content: center;
align-items: center;
left: 0px;
top: 0px;
width: 454px;
height: 454px;
}
.title {
font-size: 30px;
text-align: center;
width: 200px;
height: 100px;
}
.btn{
width:200px;
height:50px;
}Modifique el estilo del contenedor en el código predeterminado generado cuando se crea la página index.css:
-
Ya no use la pantalla de diseño flexible: flex, cambie la pantalla: flex; comente y cámbiela a flex-direction: column; para organizar todos los componentes en el contenedor verticalmente;
- Agregar estilo btn: .btn {ancho: 200 px; alto: 50 px;}
//index.js
export default {
data: {
title: 'World'
},
clickAction(){
console.log("我被点击了")
}
}
Iniciar depuración
La primera vez que inicié la depuración, parecía que iba a descargar algo. Recibí un mensaje de error aquí. No tenía una captura de pantalla en ese momento. Hice clic en un botón en la esquina inferior derecha y, luego, Windows me envió un recordatorio de seguridad. Si quiero conectarme a Internet, acepto. Volveré a hacer clic más tarde. La depuración inicia el simulador (el simulador no es lo mismo que el previsualizador).
Después de cada inicio, aparecerá un cuadro emergente como se muestra en la figura siguiente, simplemente haga clic en Aceptar (las dos figuras a continuación ilustran las dos posiciones para iniciar Debug'entry ').
Iniciar dispositivo virtual remoto
Vista previa, simulador, dispositivo virtual remoto
- Entrada de Previewer: Ver -> Ventanas de herramientas -> Previewer (debe ingresar a la página específica para editar el código y luego abrir el menú para mostrar Previewer)
- Simulador: Entrada 1: Ejecutar -> Debug'entry ', Entrada 2: Ver -> Ventanas de herramientas -> simulador (necesita la entrada 1 para ejecutar correctamente una vez)
- Dispositivo virtual remoto: Herramientas -> Administrador HVD (preste atención al límite de tiempo de uso)
Enlace al siguiente artículo:
Comience con una aplicación Huawei Hongmeng Watch 3: agregue una página de capacitación y habilítela para ir a la página principal: https://developer.huawei.com/consumer/cn/forum/topicview?tid=0202356576775850798&fid = 0101303901040230869
Enlace original:https://developer.huawei.com/consumer/cn/forum/topicview?tid=0202356408634880779&fid=0101303901040230869
Autor: chatterzhao