vue-router、created()(小知识点一)

  • vue-router第一次访问组件时会渲染组件,当再次操作该组件时,不会重新进行生成,而是会复用组件,而created()生命周期函数只会在第一次生成的时候调用,而后在复用组件的时候由于不是属于第一次生成,所以不再执行,这个时候就要用到watch监控$route(路由信息对象),当信息对象残生变化就再执行created()的函数
 export default {
        watch: {
            $route(){
                this.getData()
            }
        },
        methods: {
            getData(){
                let id = this.$route.params.userId
            
                if(id){
                    this.userInfo = this.userList.filter((item) => {
                        return item.id == id
                    })[0]
                }else{
                    this.userInfo = {}
                }   
            }
        },
        created(){
            // console.log(this.$route)
            this.getData()
        }
    }
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 用Vue.js + vue-router创建单页应用,是非常简单的,基本是这样的: 组件 → 路由 → 渲染地方 ...
    阿go阅读 1,415评论 0 0
  • 1. 简介 这篇文章主要的目的是分析理解express的源码,网络上关于源码的分析已经数不胜数,这篇文章准备另辟蹊...
    没事造轮子阅读 1,360评论 0 8
  • 这篇笔记主要包含 Vue 2 不同于 Vue 1 或者特有的内容,还有我对于 Vue 1.0 印象不深的内容。关于...
    云之外阅读 5,081评论 0 29
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 134,981评论 19 139
  • 1.安装 可以简单地在页面引入Vue.js作为独立版本,Vue即被注册为全局变量,可以在页面使用了。 如果希望搭建...
    Awey阅读 11,097评论 4 129