[Frontend] Método de vinculación del componente de tiempo WeUI DatePicker y respuesta de chatGPT

2023, semana 33, artículo 1. Ponte una meta y luego insiste en que siempre habrá un recibo, si no me crees, ¡pruébalo!
WeUI DatePicker, este componente rara vez se usa en js de archivos estáticos html puros, y olvidé cómo establecer el valor de enlace predeterminado, así que usé chatGPT para encontrar la respuesta.
Resulta que cuando chatGPT no encuentra la respuesta correcta, la escribirá por sí mismo de acuerdo con el pensamiento de programación. Corregido varias veces pero estaba mal.

inserte la descripción de la imagen aquí

1. Marco móvil

El siguiente es un arreglo simple de algunos marcos comunes de terminales móviles

1.1, Reaccionar nativo

Marco de desarrollo de aplicaciones móviles basado en React, que puede usar JavaScript para escribir aplicaciones nativas multiplataforma.

1.2, aleteo

El marco de interfaz de usuario desarrollado por Google puede usar el lenguaje Dart para crear hermosas aplicaciones multiplataforma de alto rendimiento.

1.3, iónico

Un marco de desarrollo de aplicaciones móviles de código abierto basado en Angular para crear aplicaciones híbridas utilizando HTML, CSS y JavaScript.

1.4, Marco7

Un marco HTML con todas las funciones para crear aplicaciones de iOS y Android, que proporciona componentes de interfaz de usuario ricos y efectos de animación.

1,5, Weex

El marco de desarrollo móvil multiplataforma desarrollado por Alibaba puede usar Vue.js para escribir aplicaciones y convertirlas en componentes nativos.

1.6, escritura nativa

Un marco de código abierto para crear aplicaciones móviles nativas utilizando JavaScript, TypeScript y Angular, compatible con iOS y Android.

1.7, jQuery móvil

Un marco de desarrollo de aplicaciones móviles HTML5 basado en jQuery que proporciona componentes de interfaz de usuario enriquecidos y efectos interactivos.

Estos marcos utilizan diferentes pilas de tecnología y métodos de desarrollo, y puede elegir un marco adecuado para el desarrollo de aplicaciones móviles de acuerdo con sus necesidades específicas y preferencias personales.

2. Marco WeUI

WeUI es un marco de interfaz de usuario móvil desarrollado por el equipo de Tencent, cuyo objetivo es proporcionar componentes de interfaz simples y fáciles de usar para el desarrollo de aplicaciones móviles.

Simplemente resuelva algunos conocimientos básicos del marco WeUI

2.1 Estilo de diseño

WeUI sigue un estilo de diseño simple y sencillo, centrándose en la experiencia del usuario y la facilidad de uso. Proporciona una serie de componentes comunes de la interfaz de usuario móvil, como botones, formularios, listas, navegación, etc.

2.2 Componentes

El marco WeUI se compone de múltiples componentes independientes, cada uno con estilos y funciones únicos. Los componentes comunes incluyen botones, etiquetas, íconos, formularios, listas, cuadros de diálogo y más.

2.3, biblioteca de estilos

WeUI proporciona un conjunto de bibliotecas de estilo CSS, que se pueden importar directamente al proyecto para su uso. La biblioteca de estilos define las especificaciones de diseño y estilo de cada componente, lo que permite a los desarrolladores crear rápidamente una interfaz de aplicación móvil coherente.

2.4 Diseño receptivo

Los componentes de WeUI adoptan un diseño receptivo, que puede adaptarse a diferentes dispositivos y tamaños de pantalla. Esto permite una experiencia de usuario uniforme en diferentes dispositivos móviles.

2.5 Cómo usar

Con el marco WeUI, los componentes se pueden habilitar introduciendo los archivos de estilo y los archivos JavaScript correspondientes. Al usar nombres de clase CSS específicos en HTML, se pueden usar diferentes componentes y estilos.

2.6 Personalización

El marco WeUI proporciona algunas opciones de personalización y los desarrolladores pueden personalizar el estilo y las funciones según sus necesidades. Esto permite a los desarrolladores expandir y personalizar de manera flexible según las necesidades del proyecto.

En general, WeUI es un marco de interfaz de usuario móvil conveniente y rápido diseñado para ayudar a los desarrolladores a crear interfaces de aplicaciones móviles elegantes y fáciles de usar.
Al usar el marco WeUI, los desarrolladores pueden ahorrar tiempo de desarrollo y mejorar la eficiencia del desarrollo.
Comprender los conceptos básicos de WeUI puede ayudar a los desarrolladores a usar y personalizar mejor el marco.

3. Tipo de componente de tiempo

WeUI Picker es una biblioteca de componentes de interfaz de usuario basada en dispositivos móviles para seleccionar o ingresar varios valores, fechas, horas y otra información.
Proporciona una gran cantidad de estilos de selector y métodos de interacción para facilitar a los desarrolladores la implementación de diversas funciones de selección en aplicaciones móviles.
En WeUI Picker, los selectores comunes incluyen

3.1, selector de una sola columna (Single Picker)

Se utiliza para seleccionar un valor de un conjunto dado de opciones.

3.2, selector de varias columnas (Multi Picker)

Se utiliza para seleccionar valores de vinculación en varias columnas, como un selector de vinculación de tres niveles para provincias y ciudades.

3.3 Selector de tiempo

Se utiliza para seleccionar una hora específica, puede elegir horas, minutos, segundos, etc.

3.4 Selector de fecha

Se utiliza para seleccionar una fecha específica, puede elegir año, mes, día, etc.

3.5 Selector de rango

Rango de intervalos para seleccionar valores o tiempos.

WeUI Picker proporciona una interfaz API concisa y clara y ricas opciones de configuración, que se pueden personalizar y expandir de manera flexible de acuerdo con las necesidades reales.
Es adecuado para el desarrollo web móvil basado en HTML5 y CSS3, y se puede usar en combinación con varios marcos (como Vue.js, React, etc.) para facilitar a los desarrolladores la creación rápida de interfaces de aplicaciones móviles fáciles de usar.

Cuarto, vincule el valor predeterminado

4.1, método de encuadernación correcto

La forma correcta de vincular el valor predeterminado es separar el año, el mes y el día.
De hecho, WeUI DatePicker puede defaultValueestablecer el valor predeterminado a través de la propiedad.

  • La siguiente es la forma correcta de escribir:
weui.datePicker({
    
    
    defaultValue: [2023, 8, 2], // 设置默认值为 [年, 月, 日]
    onChange: function(result) {
    
    
        console.log(result);
    }
});

En este ejemplo, usamos defaultValueel atributo para establecer el valor predeterminado en [2023, 8, 2], que representa el 2 de agosto de 2023.
Cuando el usuario abre el selector de fechas, esta fecha se mostrará de forma predeterminada y el usuario también puede seleccionar otras fechas.

Tenga en cuenta que el rango de meses es 0-11, por lo que 8 representa septiembre. El rango de valores de la fecha es 1-31.

4.2, ChatGPT respuesta incorrecta

He consultado muchas veces, pero todas las respuestas son incorrectas. Esto también muestra que chatGPT creará programas por sí mismo. Al usar esto, solo se usa como una herramienta de referencia.

  • 1) respuesta incorrecta
    inserte la descripción de la imagen aquí

  • 2) respuesta incorrectainserte la descripción de la imagen aquí

  • 3) respuesta incorrectainserte la descripción de la imagen aquí

Supongo que te gusta

Origin blog.csdn.net/lmy_520/article/details/132226534
Recomendado
Clasificación