ejemplo de montaje ion-picker (ionic4)

Los documentos oficiales Ionic4 en el componente de ion-picker no da el código apropiado de la muestra, pero su lugar en la derecha muestra de esquina superiores el efecto de código de ejemplo siguiente tiene una conexión github, este código no es la estructura del proyecto iónica estándar, pero usando el mismo principio aquí he modificado la redacción de proyectos iónicos:

HTML:

< Ion-botón expandir = "bloque" (clic) = "openPicker ()" >点击</ botón ion >

JavaScript:

importación {Componente, OnInit} de '@ angular / núcleo' ; 
importación {PickerController} de '@ iónica / angular' ; 

@Component ({ 
  selector: 'App-edit' , 
  templateUrl: './edit.page.html' , 
  styleUrls: [ ' ./edit.page.scss' ], 
}) 
clase de exportación EditPage implementos OnInit { 

  constructor (pickerController privada : PickerController) {} 

  ngOnInit () { 
  } 

  pública asíncrono openPicker () { 
    const picker = esperan esta .pickerController.create ({ 
      columnas: esta .getColumns (), 
      botones: [ 
        {
          texto: 'cancelar' , 
          Rol: 'Cancelar' 
        }, 
        { 
          texto: 'OK' , 
          Handler: (valor) => { 
            el console.log ({$ `valor [ 'COL-0' ]}` .text); 
          } 
        } 
      ] 
    }); 

    la picker.present await (); 
  } 

  o getColumns privada () { 
    // Ion-Pick tienen un problema, creado dinámicamente cuando un método de crear en los parámetros recibidos no directamente a las columnas sujetas literal debe crear cada llamada nuevo objeto, el objeto se guardará al instante a la propiedad de objetos componentes xxx, aquí por this.xxx de retorno, de esta manera no funciona, conducirá la segunda vez para abrir el estilo no es normal. 
    retorno [ 
      { 
        nombre: 'COL-0', 
        Opciones: [ 
          { 
            texto: "opción 1". , 
            Valor: 0 
          }, 
          { 
            texto: "Opción 2" , 
            valor: 1. 
          }, 
          { 
            Texto: "opción 3". , 
            Valor: 2 
          } 
        ] 
      } 
    ]; 
  } 
}

 

Supongo que te gusta

Origin www.cnblogs.com/johnjackson/p/12604683.html
Recomendado
Clasificación