nextjs组件获取数据

文章/答案/技术大牛

发布

3回答

在NextJS中获取客户端和服务器端的数据

javascript、reactjs、web、next.js、seo

我需要在NextJS项目中的一些组件中使用第三方API获取数据。我希望服务器使用SEO的API预呈现组件。但在此之后，当用户与应用程序交互时，组件道具应该在客户端获取。我能够通过使用NextJS getInitialProps方法来实现这个行为。但是在官方的NextJS文档中，建议使用getStaticProps或getServerSideProps。

浏览 10提问于2021-08-29得票数 0

1回答

下一步-将道具从自定义_app.js传递到<Navbar>组件？

javascript、reactjs、next.js、react-props

如何将道具从此处传递到我将添加到Head组件下的导航栏组件？我已经在index.js页面中使用了getServerSideProps，但它在_app.js文件中似乎不起作用。 import "..PropTypes.elementType.isRequired,}; 有没有更好的方法在每个页面中使用导航栏组件

浏览 14提问于2020-12-07得票数 4

回答已采纳

1回答

useQuery钩子(apolloClient)和getStaticProps (NextJS)的结果差异

express、graphql、next.js、apollo、apollo-client

我是NextJS和GraphQL的新手，我正在使用MERN栈和(NextJS和GraphQL)构建一个应用程序。我只需要澄清一下，我是使用getStaticProps(nextJS)中的查询返回的数据，还是使用useQuery钩子(apollo/Client)返回的数据。例如:我有一个组件，它根据ID获取数据，它的名称是id.tsx，我知道在nextJS中，我们在组件生成之前使用getStaticProps

浏览 1提问于2020-07-30得票数 3

2回答

next.js

本教程允许我从页面获取数据。组件如何取回数据呢？我有要从中获取数据的组件。我该怎么做呢？

浏览 29提问于2020-03-06得票数 2

1回答

为什么我需要将http://localhost:3000放在Next.js中从API路由获取

javascript、reactjs、next.js

我在NextJS项目的pages文件夹中创建了一个API路由。它工作得很好，我可以通过直接访问URL (如 )从它获取数据。我想在getStaticProps中获取数据，然后转发到组件中。为什么，我认为在NextJs中不包括localhost应该是可能的

浏览 0提问于2022-09-28得票数 0

1回答

重新加载或刷新页面后react redux应用程序的可靠性

reactjs、optimization、redux、user-experience

众所周知，页面的重载或刷新操作会清除redux存储中的状态数据，这往往会因为状态数据的丢失而导致渲染错误。为了解决这些问题，我们可以在重新加载页面时使用查询字符串中的参数来reFetch数据，或者在重新加载页面之前将页面所需的redux store的旧状态数据存储到localStorage中。

浏览 2提问于2018-02-07得票数 0

1回答

用Gatsbyjs构建一个动态内容的简单页面可以吗？

seo

我在React中有一个页面，显示使用API中的信息构建的不同卡片，如下所示：现在我想将它迁移到gatsby，我了解到我可以使用gatsby源代码rest-API。我很困惑，我刚开始接触盖茨比，但我想我需要它来构建符合SEO的页面还有阿波罗客户端，但我想在不使用更多库的情况下尝试它提前感谢

浏览 0提问于2022-04-04得票数 0

回答已采纳

1回答

用数据将Django请求发送到NextJS

django、request、next.js、x-www-form-urlencoded

我正在考虑将NextJS集成到现有的Django项目中。该项目在其大部分页面中大量使用Django模板，我正在考虑通过利用React和构建一个设计/组件系统来实现项目的现代化。我们的想法是，我们将考虑最终用NextJS取代Django。我已经能够使用Django通过NextJS代理一个请求，它工作得很好！我还能够直接将数据发送到NextJS路由，这样我就不必再回Django获取数据了。这种方法的缺点是只发送键/值数据</e

浏览 0提问于2020-11-30得票数 2

回答已采纳

1回答

-NextJS

node.js、reactjs、rest、axios、next.js

在axios中使用Nextjs。我还希望函数是一个组件。

浏览 7提问于2022-05-30得票数 -1

2回答

从nextjs执行API请求是否正常？

node.js、reactjs、database、express、next.js

目前，我的后端在NodeJS (快递)，目前也正在从创建-反应-应用程序迁移到NextJS的前端。我是应该将API请求从NextJS转移到快速服务器，还是应该将API移动到NextJS本身(通过NextJS与数据库直接交互)？在NextJS中编写API组件(与DB交互的逻辑)是否正常？还是应该采用更传统的NextJS与我的旧快速服务器交互的方法？这两种方法中哪一种在长期运行中更好(我知道用NextJS编写API组件在

浏览 1提问于2021-05-25得票数 3

1回答

使用nextjs* 'catch all‘路由获取数据*

reactjs、next.js、getstaticprops

使用Nextjs10，您可以拥有一个catch all路由，它看起来像这样的[...id].tsx。这个想法是，这将允许动态页面。我面临的问题是，特定的匹配路由(例如/example/new)可能需要额外的数据才能正确呈现。因为我的pages文件夹中只有一个文件，所以我只能访问一个getStaticProps调用。获取所有可能路由的所有可能数据似乎相当浪费。在组件级别获取服务器端数据将解决他的问题，但这似乎不是nextjs支持的功

浏览 50提问于2020-11-05得票数 0

1回答

getInitialProps在Next.js中是什么

javascript、reactjs、next.js

我所理解的是，getInitialProps用于在服务器上获取数据，但是，如果我们已经有了http库(如axios等)，我仍然不知道如何在服务器上这样做。请有人回答我的问题。

浏览 9提问于2020-01-25得票数 4

回答已采纳

1回答

如何在next js Image中使用动态链接？

javascript、reactjs、next.js、nextjs-image

我想在next js Image中使用动态链接。下一个Js建议 <Image alt="Picture of the author" height={500} src="https://en.wikipedia.org/wiki/Image#/media/File:Image_created_

浏览 51提问于2021-03-23得票数 2

1回答

为Nextjs的Image提供源代码的最佳方式是什么？

reactjs、next.js、nextjs-image

我正在工作的网站(Nextjs)，其中有大量的图片。因此，为了有更好的性能，图像优化是必不可少的。我检查并看到nextjs的Image组件从srcset中的图像中生成了许多质量和大小。另外，我的CDN提供了查询参数来获取特定质量和大小的图像。我认为最好的方法是在CDN中制作webp图像，并将其与Next.js的图像组件一起使用。但是如果用户浏览器不支持webp，图像组件该怎么办呢？是使用Nextjs image组件的镜像优化更好，还是为其提供加载道具并

浏览 4提问于2021-12-01得票数 0

7回答

NextJS: getInitialProps方法

javascript、reactjs、next.js

使用NextJS并看到了一个页面示例： static async getInitialProps(context) {{ }export default withRouter(IndexPage); getInitialProps方法在NextJS

浏览 1提问于2018-09-02得票数 7

回答已采纳

1回答

阿波罗useQuery只运行一次，并在组件重新呈现时跳过。

reactjs、next.js、graphql

我是GraphQL和nextJS的新手。在我的当前项目中，我只想从graphql服务器获取一次数据，并且在组件重新呈现时一直使用相同的数据。我尝试在useQuery钩子中使用skip，但是即使根组件也被重新命名了，所以无法执行。我试过useLazyLoad，但还是没有运气。任何线索都将不胜感激。谢谢。

浏览 3提问于2022-09-16得票数 0

1回答

Django的React VS NextJS

reactjs、django、next.js、frontend

因此，我想知道，学习和实现NextJS (并重新做一些我使用react所做的工作)是值得的，还是为了获得最小的结果而付出的努力呢？NextJS允许我做更多的反应(在SEO和渲染方面)吗？当实现Nextjs +React时，项目的复杂性真的增加了吗？祝你今天愉快

浏览 9提问于2022-02-02得票数 1

1回答

Nextjs、thunk和getInitialProps -如何实现

reactjs、redux、redux-thunk、next.js、server-side-rendering

我也想在我的新项目中使用nextjs与redux和thunk。我想知道如何正确地实现所有包。在我以前的项目页面中，HOC组件如下：import Page from '.dispatch(fetchUsers())}; 以及获取我在中使用某种方式的getInitialProps方法--文档

浏览 1提问于2018-07-25得票数 12

回答已采纳

3回答

视图源不显示动态内容

javascript、reactjs、next.js、server-side-rendering

我正在制作非常简单的下一个js应用程序，在这个应用程序中，除了视图源代码之外，一切都很正常。所以它在链接中是可以复制的，步骤2)在选择视图源(ctrl + u)之后的，它给出的页面如下：在这里，您可以清楚地看到，有，没有元素，有文本My name is Jared，还有所有其他文本，这些文本本来就是要存在的，但事实并非如此。整个应用程序工

浏览 0提问于2020-04-07得票数 3

回答已采纳

1回答

如何将Next.js与spring引导一起用作后端服务器？

reactjs、spring-boot、next.js

如何使用Next.js和springboot建立一个项目。我试着阅读next.js文档，所有文档都指向其他后端技术，其中没有一个显示了springboot设置。如果有人能指导我，或者为我提供一些关于如何在一个项目中使用这两个框架的文档，这将有很大的帮助。

浏览 1提问于2019-04-22得票数 7

回答已采纳

点击加载更多

在NextJS中获取客户端和服务器端的数据

下一步-将道具从自定义_app.js传递到<Navbar>组件？

useQuery钩子(apolloClient)和getStaticProps (NextJS)的结果差异