Primeiro, quando usamos function+ts para definir uma função, como segue:
// 根据某个字段给数组排序
function sortArray<T> (arr: T[], field: keyof T): T[] {
return arr.sort((a, b) => {
if (a[field] > b[field]) {
return -1
}
if (a[field] < b[field]) {
return 1
}
return 0
})
}
Esta forma de escrever compila normalmente.
Ao alterá-lo para uma função de seta, o código fica assim:
const sortArray = <T>(arr: T[], field: keyof T): T[] => {
return arr.sort((a, b) => {
if (a[field] > b[field]) {
return -1
}
if (a[field] < b[field]) {
return 1
}
return 0
})
}
Ao utilizar este método de escrita, o seguinte erro será relatado durante o processo de compilação:
“ erro Erro de análise: token inesperado. Você quis dizer `{'>'}` ou `>`? ”
Razões para o erro acima:
Em alguns casos, o uso de colchetes angulares (<>) para indicar genéricos será analisado como tags JSX.
Existem várias soluções como segue (a primeira é recomendada):
O primeiro: Adicione um "(,)" após o genérico em <>, para que não seja analisado em uma tag jsx durante a análise. O código é o seguinte:
const sortArray = <T, >(arr: T[], field: keyof T): T[] => {
return T[]
}
Segundo tipo: reescrever usando a palavra-chave extends, o código é o seguinte:
const sortTable = <T extends {}>(arr: T[], field: keyof T): T[] => {
return T[]
}
O terceiro método: reescrever o método de definição de tipo, o código é o seguinte:
const sortTable:<T>(arr: T[], field: keyof T) => T[] = (arr, field) => {
return T[]
}
Conclusão: Ao definir tipos para ts, muitas vezes encontro alguns problemas que não conheço. Consultando as informações e combinando minha própria experiência de desenvolvimento, finalmente os resolvi perfeitamente.
O conteúdo acima é original do autor. Se houver algum erro, aponte-o na área de comentários. Muito obrigado! Anexe um link ao reimprimir.
Qualquer semelhança de conteúdo é mera coincidência.