react 取得した値yyyy-mm-ddをyyyy/mm/ddにしてAPIを叩くと叩けなくなる
解決したいこと
日付をyyyy/mm/ddに変換を行い、APIを叩きたいです。
日付yyyy-mm-ddをyyyy/mm/ddに変換することはできたのですが、APIにリクエストを出すことができません
取得した日付yyyy-mm-ddをそのままクエリーパラメーターに入れてAPIは叩けるのですが、yyyy/mm/ddに変換すると、APIが叩けなくなります。
発生している問題・エラー
エラーメッセージは出てません、思うような挙動をしません
該当するソースコード
const formatDate=(dt) => {
return dt.replace(/-/g,'/');
};
const handleOnClick = event => {
event.preventDefault();
const checkinday=formatDate(checkin);
const checkoutday=formatDate(checkout);
const error = checkin === '' || checkout === '' || checkin > checkout;
SetErrormessage(error);
setButtonClicked(!error);
const url = encodeURI(`/search?checkin=${checkinday}&checkout=${checkoutday}`);
fetch(url)
.then(data => data.json())
.then(json => {
setGuesthouseList([...json]);
})
.catch((error) => {
console.error(error);
});
};
return(
<TextField className={classes.checkin} label='checkin' type='date' value={checkin}
onChange={checkinChange}
InputProps={{ inputProps: { min: today(), max: '2099/12/31' } }}
InputLabelProps={{ shrink: true, }} />
<TextField className={classes.checkout} label='checkout' type='date' value={checkout}
onChange={checkOutChange}
InputProps={{ inputProps: { min: today(), max: '2099/12/31' } }}
InputLabelProps={{ shrink: true, }} />
)
自分で試したこと
JSXから送られてきた変更前の値(checkin)(checkout)の入った
/search?checkin=${checkin}&checkout=${checkout}ではAPIをたたけていますが、
JSXから送られてきた値を変更した(checkinday)(checkoutday)になった場合は
/search?checkin=${checkinday}&checkout=${checkoutday}ではAPIをたたけていません、解決策を教えていただきたいです。
checkin,checkoutはyyyy-mm-ddの形です
checkinday,checkoutdayはyyyy/mm/ddに変換できているのは確認済みです。
0 likes
