如何使用 Nuxt.js 从缓存中排除组件?

     2023-02-23     279

关键词:

【中文标题】如何使用 Nuxt.js 从缓存中排除组件?【英文标题】:How to exclude component from caching using Nuxt.js? 【发布时间】:2021-08-14 11:18:15 【问题描述】:

我正在尝试在 Nuxt.js 中使用 Vue.js keep-alive prop,我正在尝试缓存除一个之外的所有组件,这是我想从缓存中排除的 basket 组件,每次用户添加一个项目到篮子我想再次显示组件并加载数据,我尝试过这个技巧它似乎不起作用,最好的解决方案是什么?

<template>
  <div>
    <TheHeader />
      <Nuxt keep-alive :keep-alive-props="exclude: ['basket']" />
  </div>
</template>

【问题讨论】:

【参考方案1】:

再次检查您的开发工具是否设置了正确的道具,因为这确实是正确的语法。

仔细检查您是否也有这些组件。并且其他的(您要包含的)已正确缓存。 如果还是不行,请给我们看Basket 组件或进行复制。

这还取决于您实际加载/访问数据的方式。在某些方面并不那么简单,并且取决于 vuex/middlewares 等。

【讨论】:

如何从我的 nuxt js 组件中的 node_modules 文件夹动态加载 svg 图标?

】如何从我的nuxtjs组件中的node_modules文件夹动态加载svg图标?【英文标题】:HowcanIdynamicallyloadsvgiconsfromnode_modulesfolderinmynuxtjscomponent?【发布时间】:2021-10-1016:58:41【问题描述】:我正在尝试在我的Nuxts-s-r项目中使用来自Github的这... 查看详情

nuxt.js + Apollo Client:如何禁用缓存?

】nuxt.js+ApolloClient:如何禁用缓存?【英文标题】:nuxt.js+ApolloClient:Howtodisablecache?【发布时间】:2019-12-1608:10:10【问题描述】:我设法获得了一个运行typescript和apollographql的nuxt.js+nest.js。为了测试graphql是否有效,我使用了来自this... 查看详情

使用 Spring Data Rest 时如何从组件扫描中排除 @Repository

】使用SpringDataRest时如何从组件扫描中排除@Repository【英文标题】:Howtoexcludea@RepositoryfromcomponentscanwhenusingSpringDataRest【发布时间】:2017-04-2402:59:21【问题描述】:在SpringBoot项目中,我无法从组件扫描中排除一些存储库。我有一个... 查看详情

使用 Nuxt.js 从页面组件的 asyncData() 方法调用 mixin 函数

】使用Nuxt.js从页面组件的asyncData()方法调用mixin函数【英文标题】:CallmixinfunctionfromasyncData()methodofthepagecomponentwithNuxt.js【发布时间】:2019-08-0816:17:38【问题描述】:我可以用Nuxt.js从页面组件的asyncData()方法调用mixin函数吗?我的... 查看详情

Tabulator + Nuxt.js:如何在回调中使用 axios?

】Tabulator+Nuxt.js:如何在回调中使用axios?【英文标题】:Tabulator+Nuxt.js:Howtouseaxiosincallbacks?【发布时间】:2020-01-1608:48:53【问题描述】:我尝试在我的Nuxt.js项目中添加Tabulator。我已经完成了下一个组件:<template><divref="table... 查看详情

如何在 nuxt.js 上从子组件获取父组件的值?

】如何在nuxt.js上从子组件获取父组件的值?【英文标题】:HowtogetanvaluefromChildcomponenttoParentonnuxt.js?【发布时间】:2019-11-3022:31:48【问题描述】:我一直在尝试将数据从子A($emit)组件传递给父组件,从父组件传递给子B(props)。使用n... 查看详情

如何将 BootstrapVue 在 Nuxt.js 中使用 Purgecss 所需的所有内容列入白名单

】如何将BootstrapVue在Nuxt.js中使用Purgecss所需的所有内容列入白名单【英文标题】:HowdoIwhitelisteverythingIneedforBootstrapVuetoworkwithPurgecssinNuxt.js【发布时间】:2020-02-0506:39:23【问题描述】:我创建了一个Nuxt.js项目,它使用BootstrapVue作... 查看详情

Nuxt.js 仅客户端组件

...直收到错误消息documentnotdefined。Nuxt.js文档没有提供关于如何仅在客户端加载和生成组件的明确说明。【问题讨论】:虽然有几个类似的问题,但没有一个给出完整的解决方案 查看详情

如何在 Nuxt 中用一个组件创建无限路由

】如何在Nuxt中用一个组件创建无限路由【英文标题】:HowcreatetheinfiniteroutewithonecomponentinNuxt【发布时间】:2021-10-1415:29:07【问题描述】:我最近收到了一个使用Nuxt.js的项目,但遇到了一些问题。我有一个从API获取一些产品并从Vu... 查看详情

NUXT.js 和 Axios 运行时如何避免代码重复?

】NUXT.js和Axios运行时如何避免代码重复?【英文标题】:HowtoavoidcodeduplicationwhenrunningNUXT.jsandAxios?【发布时间】:2020-11-2205:28:43【问题描述】:如果相似的代码(如示例中)在不同的组件中重复,但我在函数参数中传递的名称略... 查看详情

如何在 Nuxt.js 中使用 v-file-input 获取文件对象?

】如何在Nuxt.js中使用v-file-input获取文件对象?【英文标题】:Howtogetfileobjectusingv-file-inputinNuxt.js?【发布时间】:2021-03-1904:22:17【问题描述】:我使用了Vuetify.js作为Nuxt.Js的UI框架。当我输入文件我的应用程序时,我想获取文件对... 查看详情

如何在 nuxt js 中使用 vuetify 作为插件?

】如何在nuxtjs中使用vuetify作为插件?【英文标题】:Howtousevuetifyinnuxtjsasplugin?【发布时间】:2020-04-2321:43:53【问题描述】:我需要在我的nuxtjs项目中使用vuetify作为插件。我试过包@nuxtjs/vuetify,但得到错误无法分配给对象“#”的... 查看详情

如何使用 Nuxt.js 在 vuex 状态中获取本地存储数据

】如何使用Nuxt.js在vuex状态中获取本地存储数据【英文标题】:HowtogetlocalstoragedatainsidevuexstatewithNuxt.js【发布时间】:2019-06-1113:32:09【问题描述】:我正在使用Nuxt构建一个购物车。但是当我刷新页面时,购物篮会自动清空。我尝... 查看详情

Nuxt.js - 如何在布局内使用布局

】Nuxt.js-如何在布局内使用布局【英文标题】:Nuxt.js-Howtouselayoutinsidelayout【发布时间】:2019-01-2710:58:07【问题描述】:我有我的默认布局,我想制作一个页面带有布局和布局内部的组件将更改insdie并将url更改为我如何用nuxt做到... 查看详情

nuxt.js - 如何在服务器端为所有客户端缓存 axios 调用

】nuxt.js-如何在服务器端为所有客户端缓存axios调用【英文标题】:nuxt.js-Howtocacheaxioscallatserversideforallclients【发布时间】:2020-05-1915:45:59【问题描述】:我正在使用vue+nuxt.js应用程序,我想知道是否可以为所有客户端缓存axioswebser... 查看详情

leafage诞生记(二nuxt.js如何在组件和页面请求数据)

本文个人博客地址:https://www.abeille.top/posts/detail/213489UI上一篇创建了前端工程,接下来开始写代码。因为初始化项目,只是最小的一些基本依赖,再开发中,需要一些第三方的库来支持,比如样式/组件库。在开发Leafage网站的过... 查看详情

如何从 nuxt.js 页头的 node_modules 文件夹中引用 js 文件

】如何从nuxt.js页头的node_modules文件夹中引用js文件【英文标题】:HowcanIreferencejsfilefromnode_modulesfolderinpageheadinnuxt.js【发布时间】:2019-09-1703:04:19【问题描述】:我已将包onesignal-emoji-picker添加到我的nuxt.jsvue项目中,我想在我的页... 查看详情

如何从 WebPack 包中排除目录

】如何从WebPack包中排除目录【英文标题】:HowexcludedirectoryfromWebPackbundle【发布时间】:2021-11-2215:41:57【问题描述】:我正在使用Storybook开发React组件。我在我的应用程序中导入的SDK的文档说要包含一个文件夹\'.storybook/src/cards/myCa... 查看详情