TypeScript 新手在這里，遇到Object.fromEntries. 我正在嘗試簡化形式并將其值轉換為其他內容。例如，給定所有資料的同質形狀是字串，以下作業：
// example form content:
// {
// foo: 'bar',
// bar: 'biz'
// }
// return values
// {
// foo: 'bar',
// bar: 'biz'
// }
export const getFormData = (form: HTMLFormElement) => {
return Object.fromEntries<string>(
new FormData(form) as Iterable<[PropertyKey, string]>,
)
}
如何將上面回傳的值轉換為字串以外的值？例如：
// example form content:
// {
// foo: '1',
// bar: 'biz',
// biz: 'false'
// }
// desired return values
// {
// foo: 1,
// bar: 'biz',
// biz: false
// }
export const getFormData = (form: HTMLFormElement) => {
return Object.fromEntries<string>(
new FormData(form) as Iterable<[PropertyKey, string]>,
)
}
我的感覺是我可以用泛型和介面以某種方式修復它，但我不知道如何繼續。如果有人可以 ELI5，我將不勝感激。
編輯：我的tsconfig.json：
{
"compilerOptions": {
"moduleResolution": "node",
"module": "es2020",
"lib": ["esnext", "dom", "dom.iterable"],
"target": "es2020",
"downlevelIteration": true,
"importsNotUsedAsValues": "error",
"preserveValueImports": true,
"isolatedModules": true,
"resolveJsonModule": true,
"sourceMap": true,
"esModuleInterop": true,
"skipLibCheck": true,
"forceConsistentCasingInFileNames": true,
"baseUrl": ".",
"allowJs": true,
"checkJs": true,
}
}
EDIT2：更好地解釋期望的結果。
uj5u.com熱心網友回復：
在您的 TS 配置中添加“dom.iterable”到lib：
"lib": [
"es2019",
"dom",
"dom.iterable"
],
既然 TS 知道 DOM 元素可以回傳一個.entries()迭代器，您就不需要再顯式地鍵入它了：
Object.fromEntries(new FormData(form))
由于您使用的是 HTML 表單，因此除了字串和 blob 之外，您將一無所獲。如果您想將某些字串轉換為數字，則強制轉換對您沒有幫助。只需迭代條目，并轉換符合特定條件的值 - 例如某個鍵，或者如果將它們轉換為數字不會產生NaN. 例如（TS 游樂場）：
const formData = new FormData();
formData.append('name', 'max');
formData.append('age', '123456');
const result = Object.fromEntries([...formData].map(([key, value]) => [
key,
key === 'age' ? value : value
]))
console.log(result)轉載請註明出處，本文鏈接：https://www.uj5u.com/net/439038.html
標籤：打字稿 形式 javascript 对象 打字稿泛型
上一篇：具有基于引數的組件數量的元組
下一篇：字串擴展函式？