这甚至可能吗?我处在一种情况下,我不知道该使用什么或最好使用什么。我想要一个类似import { Component } from '@angular/core';
import { Platform } from '@ionic/angular';
import { SplashScreen } from '@ionic-native/splash-screen/ngx';
import { StatusBar } from '@ionic-native/status-bar/ngx';
import { AlertController } from '@ionic/angular';
import { PickerController } from '@ionic/angular';
export interface PickerOptions {
buttons?: any[];
columns?: any[];
cssClass?: string;
mode?: string;
enableBackdropDismiss?: boolean;
}
@Component({
selector: 'app-root',
templateUrl: 'app.component.html'
})
export class AppComponent {
horaSeleccionada:any;
constructor(
private platform: Platform,
private splashScreen: SplashScreen,
private statusBar: StatusBar,
private alertCtrl:AlertController,
private picker:PickerController
) {
this.initializeApp();
}
initializeApp() {
this.platform.ready().then(() => {
this.statusBar.styleDefault();
this.splashScreen.hide();
this.selectHora();
});
}
async selectHora() {
const times: PickerOptions = {
cssClass: 'horasSelect',
buttons: [
{
text: 'Cancelar',
role: 'cancel',
cssClass: 'btnCancel'
},
{
text: 'Confirmar',
handler: (value) => {
this.horaSeleccionada=value;
console.log('confirmacion', this.horaSeleccionada);
this.confirmacion(value);
}
}
],
columns: [
{
name: 'Horas',
options: [
{text: '8:00 - 9:00', value: 1},
{text: '9:00 - 10:00', value: 2},
{text: '10:00 - 11:00', value: 3},
{text: '11:00 - 12:00', value: 4},
{text: '12:00 - 13:00', value: 5},
{text: '13:00 - 14:00', value: 6},
{text: '14:00 - 15:00', value: 7},
{text: '15:00 - 16:00', value: 8},
{text: '16:00 - 17:00', value: 9},
{text: '17:00 - 18:00', value: 10}
]
}
]
};
const picker = await this.picker.create(times);
picker.present();
picker.onDidDismiss().then(async data => {
const col = await picker.getColumn('Horas');
console.log('Esta es la columna ', col);
this.horaSeleccionada = col.options[col.selectedIndex].value;
console.log(this.horaSeleccionada);
// this.confirmacion();
});
}
async confirmacion(value) {
const alert = await this.alertCtrl.create({
header: 'Confirmación Pedido',
subHeader: 'Si desea cambiar la hora, seleccione cancelar',
message: 'Su pedido será entregado entre las ' + value,
buttons: [
{
text: 'OK',
handler: () => {
console.log('ok texto', this.horaSeleccionada);
// this.router.navigateByUrl('/orderfinished');
}
}
],
});
}
}
的类,它将包含字符串的方法。我使用的是react js,在我的项目中,我有StringHelpers
并扩展到class
,并且我也有无状态函数。现在,我如何在两个方法上都使用Component class
方法。
目前我的StringHelpers
,我知道该怎么做。
StringHelpers
我将能够实现:
class StringHelpers {
constructor(string) {
this.string = string;
}
toUcfirst() {
return "ucfirst executing";
}
}
export default StringHelpers;
在类和无状态函数中..我如何实现这样的目标..或者我也可以适应其他有效的方法。
答案 0 :(得分:4)
您可以简单地从stringHelpers
导出函数,而不是将其设为类,然后在需要的地方导入这些函数
//stringHelpers.js
export function capitalizeFirstChar(str){
return str && str.replace(/^[a-z]/, (match)=> match.toUpperCase()) || ''
}
// test.js
import {capitalizeFirstChar} from './stringHelpers.js'
console.log(capitalizeFirstChar('hello world'))