解決したいこと
typescriptで以下のような型エラーが発生してしまうので解決したいです
(alias) const usersShow: (id: Partial<UserType>) => string import usersShow 型 '(id: Partial<UserType>) => string' の引数を型 'string' のパラメーターに割り当てることはできません。ts(2345) users.tsx(6, 20): この式を呼び出すことを意図していましたか?
関係するコード
### apis/users.tsx ### このファイルでエラーが出ています import axios from "axios"; import { usersShow } from "../urls/index"; export const fetchUser = () => { return axios.get(usersShow) <=ここのusersShowでエラーが出ています .then(res => { return res.data }) .catch((e) => console.error(e)) } ### urls/index.tsx ### const DEFAULT_API_LOCALHOST = "http://localhost:3000/api/v1" interface UserType { id: any } export const usersShow = (id: Partial<UserType>):string => `${DEFAULT_API_LOCALHOST}/users/${id}` ### App.tsx ### import { BrowserRouter, Routes, Route, useParams } from "react-router-dom"; import { Users } from "./containers/User"; import { MainTargets } from "./containers/MainTarget"; import { SubTargets } from "./containers/SubTarget"; function App() { return ( <> <BrowserRouter> <Routes> <Route path="users/:usersId" element={<Users />} /> </Routes> </BrowserRouter> </> ); } export default App;
環境など
・railsをapiモードで使っています。
・とりあえずshowアクションのみ載せています
・rails7系 ruby 3系 react18系を使用しており、Dockerで環境構築を行いました。
・エラーが出てしまったのでまだ詳細なコードは書いていません
期待する動作(まだコードは完成していません)
1React側からaxiosを使ってrailsで作ったapiを叩きに行く(今回はshowアクション。)
2 apiからのresを受け取り、React側で表示する
自分でやったこと
まず、エラーの内容をみて何をすればいいか考えてみましたが、エラーの意味がよくわかりませんでした。恐らく、引数として受け取ったidをテンプレートリテラルの中に入れる際に型エラーが起きていると思われます。なので、interfaceにid:any(入ってくる数字が文字扱いなのか数字扱いなのかわからなかったのでとりあえずanyにしました。id:stringにしてもエラーが出ました)を設定しました。しかし、エラーが直りませんでした。
次にこの方の記事を参考にしてみました
https://teratail.com/questions/252125
どうやら「型をPartial<User>」のようにすると直ったようです。ですが私の場合エラーが直りませんでした。
他にも調べたのですが、なぜエラーになるのか分かりませんでした。何かしらアドバイスがあればよろしくお願いいたします。

回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。