La primera vez que entré en contacto con la plataforma de código bajo AppCube, todavía era una barrera.

Vi la aplicación AppCube Rubik's Cube del sitio web oficial de Huawei Cloud. Simplemente aprendí que es una plataforma de código bajo que puede construir varios procesos comerciales. Siempre quise saber sobre la plataforma de código bajo antes, así que tengo esta serie. de artículos

Esta serie de blogs experimentará de forma inmersiva el contenido relacionado con APPCube hasta que sea posible desarrollar una aplicación completamente desde cero.

entrada del proyecto

Abra https://www.huaweicloud.com/product/appcube.html y elija usar AppCube inmediatamente para ingresar a la página de administración en segundo plano.

Después de ingresar a la interfaz principal, la división de cada menú de funciones es relativamente clara. Lo que puedo ver de un vistazo es cómo crear una aplicación. Después de hacer clic en la tarjeta correspondiente, saltará al manual de ayuda, que nos ayudará a entender cómo para usar AppCube.

Cambie a la columna del proyecto, y luego aparece. Realmente es una plataforma de código bajo. Las palabras que lo ayudan rápidamente son muy llamativas.

Me gusta la plataforma que es rápida para comenzar, y solo elijo la aplicación ligera para comenzar.

aplicación de luz

Después de ingresar a la plataforma de aplicaciones ligeras, encontré muchas plantillas, estas plantillas deberían ser las entradas relevantes para ayudarnos a construir rápidamente aplicaciones ligeras.

Lo primero que llama la atención es la plantilla [Questionnaire (High-level)], luego debemos elegir [Questionnaire (Low-level)], y el menú desplegable realmente lo hace.

Después de hacer clic en Usar plantilla, aparece la siguiente interfaz, que debería ser la configuración de la información básica de la aplicación de luz (antes de esto, creé una plantilla en blanco, por lo que mi interfaz es la siguiente)

En la imagen de arriba, solo la etiqueta y el nombre son elementos obligatorios. Para el primer uso, es mejor mantener el contenido predeterminado, excepto los campos obligatorios.

Debido a que la resolución de pantalla de la computadora portátil que estoy usando es relativamente pequeña, vi la plataforma de código bajo por primera vez, de la siguiente manera:

Con el manual de ayuda , es fácil entender la página.

Haga clic directamente en la vista previa (icono de ojo) a la izquierda para obtener una vista previa de la plantilla y sepa que se trata de una aplicación ligera similar a un cuestionario, que incluye una pequeña página de administración de fondo.

Cierre la página de vista previa, vuelva al editor y busque el área central en el editor, como se muestra en la siguiente figura:

Debido a la experiencia de codificación, esta parte del contenido es muy fácil de entender. El archivo modelo, el archivo de página y el archivo lógico deben ser una combinación de estas tres partes.

ModelHaga clic en el contenido de la carpeta y la página que aparece me recuerda la configuración relevante del software de la base de datos. Si no sé nada al respecto, puede ser difícil comenzar, pero con experiencia en programación, es mucho. más simple, y no hay umbral para la perfección.

La imagen de arriba es el campo de datos configurado en el modelo.

A continuación, ingrese a Pagela carpeta, las operaciones en ella son muy poderosas y el estilo de arrastrar y soltar me recuerda la escena cuando estaba aprendiendo winform.

Desde el componente de la izquierda , arrástrelo a la página de la derecha y luego opere el componente.

Parte difícil para principiantes.

Dado que la página es una configuración de arrastrar y soltar, quería probarla sin consultar el manual para ver si podía comprender el encanto central de la programación de código bajo. Más tarde, se demostró que el código bajo no es igual a la simplicidad. .

AppCube cumple totalmente con el principio de uno para dos.

El proceso de vinculación de datos consiste en vincular los objetos personalizados mencionados anteriormente.

Aquí obtengo el objeto vinculado al componente de formulario editándolo.

Después de observar el enlace de datos de otros componentes, la conclusión es que el formulario está vinculado a una tabla , cada campo está vinculado a un solo componente y la vista del modelo se encuentra en la parte inferior de la página, suponiendo que la página completa se puede vincular directamente al objeto. , lo que se puede verificar en pruebas posteriores.

Las otras configuraciones de los componentes son familiares y fáciles de entender, por lo que no es necesario agregar demasiadas explicaciones.

Aquí se reserva la siguiente incógnita, es decir, aparece una costumbre editFlag(¿logotipo de edición?) en el modelo, que no se puede leer directamente, y se deja para resolver más adelante.

A continuación, haga clic en el botón Enviar , cambie al panel de funciones de eventos a la derecha y busque la sección de código personalizado.Esta debería ser la lógica de guardado, pero después de abrirlo, se encuentra que hay código. (Parece que el código bajo literalmente significa escribir código aquí)

El sistema integra algunas sugerencias de código para implementar rápidamente la lógica del código, lo cual es excelente.

// 获取当前页面
var pageName = context.$page.params.pageName;
// TODO: Your business logic
context.$model.ref("form_1").setData(model);
context.$model
  .ref("form_1")
  .save()
  .then((data) => {
    
    
    if (data.resCode == 0) {
    
    
      $var.recordId = data.result[0] && data.result[0].id;
      // open in current tab
      let queryParam = "recordId=" + $var.recordId + "&page=" + pageName;
      context.$page.loadStdPage("hys__question_submitPage", queryParam);
    }
  });

La lógica del botón de envío es relativamente compleja, el botón de reinicio es relativamente simple

// 当前组件
let _component = context.getCurrentComponent();

// 当前Form
let _form = _component.getForm();

_form.resetFields();

presentación del cuestionario

A continuación, aprenda sobre la lógica de representación de la página, abra la question_ManagementPagepágina y la interfaz es la siguiente, la más importante de las cuales sigue siendo la lógica de enlace entre el modelo de datos y el componente.

Esta página no es difícil de entender, basta con filtrar los cuestionarios enviados por los usuarios y vincular directamente el hys__question_qR__CSTmodelo .

Primer contacto con la experiencia AppCube

1. Una plataforma low-code no es igual a no-code;
2. El uso de la plataforma low-code es difícil de iniciar y tiene ciertos umbrales, debe estar dirigido a personas con experiencia en programación;
3. La plataforma de código bajo puede crear aplicaciones rápidamente con la ayuda de plantillas.Por ejemplo, el cuestionario mencionado en este artículo se puede personalizar y ampliar modificando directamente el modelo y los elementos de la página.
4. Necesita ver el manual de ayuda, asegúrese de leerlo.

Este blog presenta una idea de aprendizaje de contacto para usted. Puede seguir el mismo proceso para experimentar completamente AppCube y luego comenzar el desarrollo inicial. El próximo blog implementará una aplicación de WorkingTime AppCube para usted.