我需要帮助才能停止在路线更改时再次进行相同的 API 调用。我试图在网络和 stackoverflow 上找到可用的解决方案,但我无法弄清楚修复此问题需要进行哪些更改。
我还尝试使用 sessionStorage 来存储一个标志,如果 API 调用被触发,则标志设置为 true,并且在路由器更改时,我检查标志是否为 true,然后不进行任何 API 调用。但随后它会将文章列表清空。
我有一个带路由的主要应用程序组件,其中包含两个组件:(请参阅下面给出的代码)
我面临的问题是,当我第一次点击时http://localhost:3001,它会重定向到http://localhost:3001/articles页面并正确呈现ArticleHome组件并获取文章列表。然后我单击“书签”链接,它会呈现http://localhost:3001/bookmarks路线和相关组件,并进行 API 调用来呈现书签列表。
但是,当我使用路由器返回“文章”页面时,http://localhost:3001/articles由于每次路由更改时组件都会重新渲染,它会再次触发 API 调用来获取文章。
谁能指导我如何在路由器更改和组件重新渲染时停止再次执行 API 调用?
如果数据已经加载,是否有更好的方法来处理同一组件的路由器更改上的 API 调用?
class App extends React.Component<any, any> {
constructor(props: any) {
super(props);
}
render() {
return (
<Router>
<React.Fragment>
<Switch>
<Route exact path="/" render={() => <Redirect to="/articles" />} />
<Route path="/articles" render={() => <ArticleHome type="articles" />} />
<Route path="/bookmarks" render={() => <BookmarkHome type="bookmarks" …Run Code Online (Sandbox Code Playgroud) 我是 Ionic 的新手。我刚刚在本地系统上安装了新发布的 Ionic React 4.11 ( https://ionicframework.com/blog/annoucing-ionic-react/ )。但是在某些组件上找不到合适的文档。此文档页面不包含任何使用示例。
我需要一些帮助来实现下面给出的链接中显示的导航示例。
https://ionicframework.com/docs/api/nav
任何人都可以指导如何在 Ionic React 中实现相同的示例。
我在这里找到了示例代码:https : //github.com/ionic-team/ionic-docs/blob/master/src/demos/api/nav/index.html
但它是纯 JavaScript,所以我尝试将其转换为 React 格式。但不确定如何在 React 中转换相同的示例代码。只有 Pending 部分是在单击任何项目时注入相关的 NavDetail 组件。请参阅随附的屏幕截图,我能够实现多少。
const techs = [
{
'title': 'Angular',
'icon': 'angular',
'description': 'A powerful Javascript framework for building single page apps. Angular is open source, and maintained by Google.',
'color': '#E63135'
},
{
'title': 'CSS3',
'icon': 'css3',
'description': 'The latest version of cascading stylesheets - the styling language of the web!',
'color': '#0CA9EA' …Run Code Online (Sandbox Code Playgroud) 我需要关于通过其子子数组属性在给定的 Javascript 对象数组下过滤的帮助。
我有一个反应应用程序,当用户在搜索框中键入字符串时,我想在其中过滤文章,但我的问题与仅过滤对象有关,它的子数组值。
this.state = {
articles: [
{title: 'title 1', tags :["JavaScript", "ES6"], category: "JavaScript"},
{title: 'title 2', tags :["React", "TypeScript"], category: "React"},
{title: 'title 3', tags :["JavaScript", "Inheritance", "Prototype"], category: "JavaScript"}
]
};
Run Code Online (Sandbox Code Playgroud)
// If user start typing in searchbox like "jav" then it should filter only those items which tags name matching with "jav". Tags is an Array
[
{title: 'title 1', tags :["JavaScript", "ES6"], category: "JavaScript"},
{title: 'title 3', …Run Code Online (Sandbox Code Playgroud)