typescript - VS-Code'da QuickInput'u nasıl kullanacağım konusunda tamamen emin değilim


Yakın zamanda bir soru sordum: "Özel bir VS Code uzantısında özel bir komuta nasıl özel parametreler ekleyebilirim" ve bazı yorumlar üzerinden komut paletine parametre giremeyeceğini fark ettim. Bu yüzden alternatif seçenekler aradım. Karşıma çıkanlardan biri quickInput idi ve bu kullanıcıya bir pencereye metin girmesine izin veriyordu. Ancak, Typescript konusunda yeni olmam ve elimde daha bilgili kullanıcılar için dokümantasyonun bulunması nedeniyle bunu nasıl kullanacağımı çözemedim. Lütfen yardım edin!

güncelleme: "quickInput" bulunamadığı için "showInputBox" kullanmaya karar verdim ama "title" parametresini nasıl kullanacağımı bilmiyordum. ama sadece test amacıyla şunu denemeye karar verdim:

var info  = vscode.window.showInputBox();
vscode.window.showInformationMessage(info);

ama şu hatayı verdi:

No overload matches this call.
Overload 1 of 4, '(message: string, ...items: string[]); Thenable<string | undefined>', gave the following error.
Argument of type 'Thenable<string | undefined>' is not assignable to the parameter of type 'string'.
Overload 2 of 4, '(message: string, ...items: MessageItem[]); Thenable<MessageItem | undefined>', gave the following error.
Argument of type 'Thenable<string | undefined>' is not assignable to the parameter of type 'string'. ts(2769) [29, 40]

Sadece 1 ve 2 numaralı aşırı yüklemeleri verdiğini fark ettim, 3 ve 4'ü vermedi. Her neyse, şimdi şunu bilmem gerekiyor: 1) giriş kutusuna bir başlık nasıl eklenir, ve 2) o hatayı nasıl çözebilirim!!!

düzenleme 2: bu değişken tipi sorununu çözmek için bunu denedim:

var info = vscode.window.showInputBox();
if(typeof info === "string") {
    vscode.window.showInformationMessage(info);
}

ve hiçbir hata vermeden çalıştı ama... girişimi aldı ve göndermedi.

Cevap #1

Daha önce kullandığım bazı örnek kodlar (değiştirilmiş):

let inputBoxOptions = {
  ignoreFocusOut: true,
  title: "your title here"
};

// you can use the above or below ways to specify your inputBoxOptions
// 'command' is a variable I have declared elsewhere I want to use now 

inputBoxOptions.prompt = `Enter an alias for the command: ${ command } . . . . . `;
inputBoxOptions.placeHolder = `Enter an alias(es) for the ${ command } here`;

await vscode.window.showInputBox(inputBoxOptions)
  .then(arg => {
      // run your code using the inputBox 'arg' here
   });
}

Kullanıcının girdiğini await ile beklemeniz gerekiyor. Ardından bunu then fonksiyonunda veya aşağıdaki gibi kullanabilirsiniz:


Veya belgelerdeki örnek:

export async function showInputBox() {
    const result = await window.showInputBox({
        value: 'abcdef',
        valueSelection: [2, 4],
        placeHolder: 'For example: fedcba. But not: 123',
        validateInput: text => {
            window.showInformationMessage(`Validating: ${text}`);
            return text === '123' ? 'Not 123!' : null;
        }
    });
    window.showInformationMessage(`Got: ${result}`);
}

temel girdi belgeleri