reactjs - React Hooks - Yıkılmış dizi değişkenleri ile JSDoc
Basit bir React Typescript bileşenini hook'larla JSDoc ile belgelendirmeye çalışıyorum. Ne yazık ki, JSDoc'un tanımlanmış ayrıştırılmış dizilerle çalışmasını sağlayacak bir yol bulamıyorum. Nesne parametrelerinin ayrıştırılmasıyla ilgili bazı cevaplar var, ancak bunlar diziler için çalışmıyor.
/**
* @property {boolean} 0 - documentation for isLoading
* @property {func} 1 - documentation for setIsLoading
*/
const [isLoading, setIsLoading] = React.useState<boolean>(false);
Güncelleme 1: Bu yapıdan çıkarma işlemini belgelemek için bir yol bulmakta hâlâ zorlanıyorum. Eğer bir nesneyi özel tip olarak tanımlarsam, çalıştığı bir kenar durumu var:
export type AuthFormInput = {
/** Value of the Email input field */
email: string;
/** Value of the Password input field */
password: string;
};
const [form, setForm] = React.useState<AuthFormInput>({
email: '',
password: ''
});
...
// JSDoc will work here
const email = form.email;
Cevap #1
Yardımcı olur:
/**
* @typedef {Boolean} LoadingState — documentation for isLoading
* @description Additional doc
*/
/**
* @typedef {Function} LoadingStateSetter — documentation for setIsLoading
*/
/**
* @type {[LoadingState, LoadingStateSetter]} Loading
*/
const [isLoading, setIsLoading] = React.useState();
Bu örnekte iki ek tür tanımlıyoruz: LoadingState ve LoadingStateSetter. Ardından bunlar için bazı açıklamalar ekliyoruz ve son olarak React.useState() sonucunun türü olan Loading türünü tanımlıyoruz
Bunu daha basit bir şekilde şu şekilde de tanımlayabilirsiniz:
/**
* @type {[Boolean, Function]} Loading
*/
const [isLoading, setIsLoading] = React.useState();
Ama bu durumda bir açıklama eklemenin yolunu bulamadım.
VSCode'da böyle bir belgeleme yönteminin açıklamasını kontrol ettim
Cevap #2
Bunu deneyebilirsin:
/** @type {boolean} */
const initialState = false
const [isLoading, setIsLoading] = React.useState(initialState)
