nuxtjs的nuxt标签使用用keep-alive和keep-alive-props

2021-03-03 16:10:42

nuxt.js 列表界面分页加载后进入详情页,返回上一页如何让界面不重新加载


我们可以使用keep-alive标签,到底应该怎么使用呢。

官方文档地址为 The Nuxt Component


1、在标签上添加属性

<nuxt  keep-alive :keep-alive-props="{ include: includeArr }" />


// js

data () {

return {

includeArr: ['cardApplyQuery'] // 需要缓存的组件名数组

}

}


2、在组件中添加name属性

这个是好多网上教程没有点明的,这里重点提出。一定要在组件中加上对应的name


export default {

name: 'cardApplyQuery'

}


其他 expend 等属性也是支持的。不详细列出。



  • 2019-11-12 02:56:39

    使用.htaccess重定向后无法显示图片,CSS失效,该如何处理

    现在我需要把这个域名泛解析到blog目录(*.mydomain.org),同时保持另外两个目录的解析不变。尝试对最后一段作以下修改后(前面的内容不变),出现问题:另两个目录中的网站内的图片无法显示,CSS全部失效。

  • 2019-11-14 11:21:34

    vue中的this指向问题

    ※ 对于普通函数(包括匿名函数),this指的是直接的调用者,在非严格模式下,如果没有直接调用者,this指的是window。showMessage1()里setTimeout使用了匿名函数,this指向 window。 ※ 箭头函数是没有自己的this,在它内部使用的this是由它定义的宿主对象决定。showMessage2()里定义的箭头函数宿主对象为vue实例,所以它里面使用的this指向vue实例。

  • 2019-11-18 23:18:49

    spring boot中读取配置信息一

    首先我们都知道一个常识,那就是每个人都有自己的年龄,比如我们现在的业务需求是查询所有年龄大于20的人的相关信息,如果我们选择通过配置文件来配置这个值为20的常量的话,我们该如何配置和如何从配置文件中获取这个值呢?,application.yml的内容如下(注意 “age:“ 和 “20“ 之间需要一个空格,yml的语法 ):

  • 2019-11-19 01:20:18

    java8 forEach、filter、map

    filter()、findAny()、orElse()配合使用,可以根据条件获取某个元素,如果没有返回指定的值。

  • 2019-11-19 01:24:01

    使用JAVA8 filter对List多条件筛选

    记录项目开发的过程中遇到的一些问题及解决方法,由于公司操作数据库都是统一使用工具生成的存在一些多表查询模糊查询,这些操作只能在集合方面下手了,比如发送邮件记录方面查询,对用户的名字及邮件模糊检索 年龄匹配查询。