前提・実現したいこと
クエリーパラメーターのURLをyyyy-mm-dd型のデータをyyyy/mm/ddに変換たい
fetch(/oo?checkin=${checkinday}&checkout=${checkoutday}
)の${}の部分がyyyy-mm-ddの形APIをたたいており、
yyyy/mm/ddにしたいのですが、実装できません
現在 oo?checkin=2021-10-03&checkout=2021-10-04
実装したいURL oo?checkin=2021/10/03&checkout=2021/10/04
発生している問題・エラーメッセージ
エラーメッセージは出てなく、思うような挙動になりません
該当のソースコード
javascript
1const formatDate=(dt) => { 2 var y = ('0000' + dt.getFullYear()).slice(-4); 3 var m = ('00' + (dt.getMonth()+1)).slice(-2); 4 var d = ('00' + dt.getDate()).slice(-2); 5 return (y + '/' + m + '/' + d); 6 }; 7 const handleOnClick = event => { 8 event.preventDefault(); 9 const checkinday=formatDate(checkin); 10 const checkoutday=formatDate(checkout); 11 const error = checkinday === '' || checkoutday === '' || checkinday > checkoutday; 12 SetErrormessage(error); 13 setButtonClicked(!error); 14 fetch(`/oo?checkin=${checkinday}&checkout=${checkoutday}`) 15 .then(response => { 16 if (response.ok) { 17 response.json().then(results => { 18 setGuesthouseList(results); 19 }); 20 } 21 ; 22 }); 23 }; 24return( 25 <TextField 26 id="min" 27 select 28 label="min" 29 value={min} 30 onChange={minChange} 31 helperText="" 32 > 33 {mins.map((option) => ( 34 <MenuItem key={option.value} value={option.value}> 35 {option.label} 36 </MenuItem> 37 ))} 38 </TextField> 39 <TextField 40 id="max" 41 select 42 label="max" 43 value={max} 44 onChange={maxChange} 45 helperText="" 46 > 47 {maxs.map((option) => ( 48 <option key={option.value} value={option.value}> 49 {option.label} 50 </option> 51 ))} 52 </TextField> 53)
試したこと
const formatDate=(dt) => {
var y = ('0000' + dt.getFullYear()).slice(-4);
var m = ('00' + (dt.getMonth()+1)).slice(-2);
var d = ('00' + dt.getDate()).slice(-2);
return (y + '/' + m + '/' + d);
};
この関数をAPIを叩く前に噛ませてyyyy-mm-ddをyyyy/mm/ddに変換する処理を行えおらず、
oo?checkin=2021-10-03&checkout=2021-10-04の状態でAPIを叩いていました。
JSX部分でカレンダーから取得した値を(yyyy-mm-dd)を(yyyy/mm/dd)に変更したいです。
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。