文章/答案/技术大牛

发布

社区首页 >问答首页 >绑定元素‘post’隐式具有‘任意’类型。

问绑定元素‘post’隐式具有‘任意’类型。
EN

Stack Overflow用户

提问于 2022-05-27 19:26:59

回答 2查看 330关注 0票数 0

我正在编写的代码涉及graphql、react和类型记录。我得到了错误消息，绑定元素'posts‘隐式地有’任意‘类型。我不知道这意味着什么，需要帮助。下面是错误来自的代码，谢谢

import type { NextPage } from 'next'
import Head from 'next/head'
import Image from 'next/image'
import {PostCard, Categories, PostWidget} from '../components'
import {getPosts} from '../services'

export default function Home({posts}) {
  return (
    <div className="container mx-auto px-10 mb-8">
      <Head>
        <title>FTS Blog</title>
        <link rel="icon" href="/favicon.ico" />
      </Head>

      <div className="grid grid-cols-1 lg:grid-cols-12 gap-12">
        <div  className='lg:col-span-8 col-span-1'>
          {posts.map((post) => <PostCard post={post} key={post.title}/>)}
        </div>
      
        <div className="lg:col-span-4 col-span-1">
          <div className="classname lg:sticky relative top-8">
            <PostWidget />
            <Categories />
          </div>
        </div>
      </div>

    </div>
  )
}

export async function getStaticProps() {
  const posts = (await getPosts()) || []

  return {
    props:{posts}
  }
}

reactjs

typescript

next.js

graphql

tailwind-css

回答 2

Stack Overflow用户

回答已采纳

发布于 2022-05-27 20:03:21

我认为您可以简单地使用类型记录中的接口。

此语法将解决您的问题：

import type { NextPage } from 'next';

interface HomeProps{
    posts:any[]
}

const Home: NextPage<HomeProps> = ({ posts }) => (
<div className="container mx-auto px-10 mb-8">
    <Head>
        <title>FTS Blog</title>
        <link rel="icon" href="/favicon.ico" />
    </Head>

    <div className="grid grid-cols-1 lg:grid-cols-12 gap-12">
        <div  className='lg:col-span-8 col-span-1'>
            {posts.map((post) => <PostCard post={post} key={post.title}/>)}
        </div>

        <div className="lg:col-span-4 col-span-1">
            <div className="classname lg:sticky relative top-8">
                <PostWidget />
                <Categories />
            </div>
        </div>
    </div>

</div>
  );

export default Home;

票数 1

Stack Overflow用户

发布于 2022-05-27 19:56:16

这是类型记录中的一个错误，它让您知道您的支柱posts没有定义类型，因此它被假定为any类型。

您可以通过显式地为posts提供any类型来消除错误，但是posts显然应该是基于您所拥有的代码：posts.map((post) => ...的这一行的数组。因此，您可能希望为posts提供如下所示的any array类型：

export default function Home({posts}: {posts: any[]}) {

Nextjs有一些关于如何在打字本中使用getStaticProps的附加信息。

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/72410216

复制

相似问题

问绑定元素‘post’隐式具有‘任意’类型。
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问绑定元素‘post’隐式具有‘任意’类型。EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问绑定元素‘post’隐式具有‘任意’类型。
EN