🖥

Next.js (React) + typescript + axios で Property 'xxx' does not exist

2023/09/01に公開

エラー

Property 'title' does not exist on type 'never'.
Property 'body' does not exist on type 'never'.

と言われる

コード例

import React, {useState, useEffect} from 'react'

function AxiosGet() {
  const baseURL = "https://jsonplaceholder.typicode.com/posts/1";
  const [post, setPost] = React.useState(null);

  React.useEffect(() => {
    axios.get(baseURL).then((response) => {
      setPost(response.data);
    });
  }, []);

  if (!post) return null;

  return (
    <div>
      <h1>{post.title}</h1>
      <p>{post.body}</p>
    </div>
  );
}

解決

プロパティではなくハッシュの値として書くととりあえず回避できた
たぶん本来であれば型を正しく指定したりする必要があるかも


  return (
    <div>
      <h1>{post['title']}</h1>
      <p>{post['body']}</p>
    </div>
  );

参考

https://qiita.com/esoul/items/5ac4ae8260624dde135f

チャットメンバー募集

何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。

https://line.me/ti/g2/eEPltQ6Tzh3pYAZV8JXKZqc7PJ6L0rpm573dcQ

Twitter

https://twitter.com/YumaInaura

公開日時

2023-01-04

Discussion