精华内容
参与话题
问答
  • vue 子组件 created 方法不执行问题

    万次阅读 2019-05-10 16:15:29
    近期做了一个项目 里面有一个树形菜单,将数据写在 js (死数据)中,所有的东西都能够正常执行(i 标签,子节点,父节点),但是当在请求接口文件或者请求后台数据的时候,发现引入的子组件的created方法不执行,...

    近期做了一个项目 里面有一个树形菜单,将数据写在 js (死数据)中,所有的东西都能够正常执行(i 标签,子节点,父节点),但是当在请求接口文件或者请求后台数据的时候,发现引入的子组件的created方法不执行,但是点击父级菜单展开时还是能够触发,后来发现 是生命周期的问题,仔细查看一下,后来解决 解决方法如下:用watch 检测一下data的数据变化,created方法既然在点击的时候执行,所以也必须保留,好啦,就这样

    展开全文
  • 今天小编就为大家分享一篇vue 路由子组件created和mounted起作用的解决方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
  • 有一个场景是,上一个页面选中表格的数据,作为参数传递给下一个页面,每次选择不同的参数都会打开一个新的页面,第一次打开,还是执行created和mounted的,第二次或之后在打开就不执行了,所以在created和mounted中...

    我现在做的这个是vue多页面的项目,有一个场景是,上一个页面选中表格的数据,作为参数传递给下一个页面,每次选择不同的参数都会打开一个新的页面,第一次打开,还是执行created和mounted的,第二次或之后在打开就不执行了,所以在created和mounted中赋值时都是第一次赋的值,虽然url里是不一样的数据,奈何页面拿不到啊,

    解决办法:在watch方法里在赋值一遍

    watch: {
        '$route' (to, from) {
            console.log(this.$route.query)
    }
    
    展开全文
  • vue-router路由跳转created不执行页面刷新的解决办法 当使用路由参数时,多个路由绑定同一个组件,再切换页面时,因为多个路由都渲染同个组件,此时不会销毁再创建组件而是会复用组件,这也就导致路由参数发生变化...

    vue-router路由跳转created不执行页面不刷新的解决办法

    当使用路由参数时,多个路由绑定同一个组件,再切换页面时,因为多个路由都渲染同个组件,此时不会销毁再创建组件而是会复用组件,这也就导致路由参数发生变化,但是页面不会刷新的问题

    解决办法:
    可以通过vue-router 的钩子函数 beforeRouteEnter beforeRouteUpdate beforeRouteLeave 路由进入钩子

    beforeRouteEnter(to, from, next) {
    // 在组件实例创建前调用
    }
    

    beforeRouteUpdate 路由更新钩子

    beforeRouteUpdate
    beforeRouteUpdate(to, from, next){
    // 在当前路由改变,路由参数发生变化,组件被复用时调用
    // 里面写获取刷新数据的方法
    }
    

    beforeRouteLeave 路由离开钩子

    beforeRouteLeave(to, from, next) {
    // 当离开当前组件对应的路由时调用
    }
    
    展开全文
  • 多个路由映射到同个组件,只是传参不同,页面切换不会触发组件的创建cteated方法,怎么办?官方给出的解决办法:...

    开发中遇到的需求是:

    多个页面调用同一组件,通过传参获取不同的数据展示在页面上。多个路由映射到同个组件,只是传参不同,页面切换不会触发组件的创建cteated方法,怎么办?


    官方给出的解决办法:

    https://router.vuejs.org/zh-cn/essentials/dynamic-matching.html#%E5%93%8D%E5%BA%94%E8%B7%AF%E7%94%B1%E5%8F%82%E6%95%B0%E7%9A%84%E5%8F%98%E5%8C%96

     通过watch(监测变化) $route 对象,将获取数据的方法写在watch里

    具体尝试了以下几种方法都可实现:


    方法一:query传参

    router.js(路由配置)

    {
        path: '/back',
        redirect: '/back/yjzx',
        component: viewport,
        children: [
          { path: 'yjzx', name: 'yjzx', component: article }
        ]
      }
    Vue(其他页面调用)
    <router-link :to="{name:'yjzx', query: {type: '1'}}" tag="li"><!--多个router-link的name一样或不一样都可,因为带的参数不一样-->
        <i class="fa fa-list-ul fa-fw"></i>
        <span>业界资讯</span>
    </router-link>

    Vue(页面代码)

    watch: {
        '$route' (to, from) {
          console.log(this.$route.query)
        }
    },


    方法二:params传参

    router.js(路由配置)

    {
        path: '/back',
        redirect: '/back/yjzx',
        component: viewport,
        children: [
          { path: 'yjzx', name: 'yjzx', component: article }
        ]
      }
    Vue(其他页面调用)
    <router-link :to="{name:'yjzx', params: {type: '1'}}" tag="li"><!--多个router-link的name必须不一样,因为参数是以POST方式传递-->
        <i class="fa fa-list-ul fa-fw"></i>
        <span>业界资讯</span>
    </router-link>

    Vue(页面代码)

    watch: {
        '$route' (to, from) {
          console.log(this.$route.params)
        }
    },


    方法三:通过变量传参

    router.js(路由配置)

    {
        path: '/back',
        redirect: '/back/yjzx/:type',
        component: viewport,
        children: [
          { path: 'yjzx/:type', name: 'yjzx', component: article }
        ]
      }
    Vue(其他页面调用)
    <router-link :to="{path:'/back/yjzx/1'}" tag="li"><!--多个router-link的name一样或不一样都可,因为参数不同-->
        <i class="fa fa-list-ul fa-fw"></i>
        <span>业界资讯</span>
    </router-link>

    Vue(页面代码)

    watch: {
        '$route' (to, from) {
          console.log(this.$route.params)
        }
    },


    3种方式我实践过,都可以实现,看个人的爱好和项目情况来定吧。








    展开全文
  • 今天在写vue项目的时候遇到了这样一个问题当我点击某一个二级菜单的时候会进入到相应的页面,但是这个页面的created方法不执行 代码如下: data(){ return{ uploadData: { userId: '123', } } }, methods: { ...
  • VUE路由跳转,created方法不再执行 项目中遇到created方法执行一次的情况,不会随着路由跳转再次执行的情况 解决方法: 1、在父组件中加key <template> <router-view :key="$route.fullpath"></...
  • vuecreated函数中,方法执行顺序

    万次阅读 2019-03-20 21:55:51
    vuecreated钩子函数中,方法执行顺序 情景:vue框架中通常在created钩子函数里执行访问数据库的方法,然后返回数据给前端,前端data中定义全局变量接收数据 但是如果你在created执行了好几个访问数据库的函数...
  • watch: { '$route' (to, from) { console.log(this.$route.params) } },
  • 错误截图 该方法出自 可以看到created方法执行了两次 原因 由于写的时候没注意 加载了两次子路由出口导致发送了两次请求 只需要删去其中一个即可
  • Vue进阶(三十六):vue.js中created方法的使用详解

    万次阅读 多人点赞 2019-01-30 14:36:54
    这次给大家带来vue.js中created方法的使用详解,使用vue.js中created方法的注意事项有哪些,下面就是实战案例,一起来看一下。这是它的一个生命周期钩子函数,就是一个vue实例被生成后调用这个函数。一个vue实例被...
  • *created()方法里面执行了的,因为我在里面加了alert正常弹出 *所以我想问下这样写为啥不行,我该怎么写呢* ![图片说明](https://img-ask.csdn.net/upload/201908/22/1566462666_448040.jpg)
  •  在网搜索到这位哥们的博客,完美解决了我的问题。感谢博主,博客地址: ... 博客内容大致如下: 需求分析 ...导航上有2个菜单,指向的是同一个列表,但是是不同的状态。我需要根据不同的状态获取状态参数给接口拿...
  • vue 多个路由路由跳转created不执行

    千次阅读 2019-08-29 18:19:54
    今天做项目的时候发现,vue页面路由跳转的时候,created函数不执行created() { }, 解决办法 使用watch函数监听路由即可。 watch:{ '$route'(to,from){ } }, 响应路由参数的变化 提醒一下,...
  • Vue项目中created生命周期重复执行缓存下来,原因是什么呢?
  • 目录 第一章 问题 第二章 问题原因 ...然后发现categoryId只会更新一次,也就是说这个classifiedBooks.vuecreated函数只执行了一次,所以我无论点上面的哪一个类别显示的都是一个类别   第二章 问题原因...
  • 主要介绍了解决vue做详情页跳转的时候使用created方法 数据不会更新问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
  • vue created mouted 调用 methods方法

    千次阅读 2020-06-04 15:56:59
    要他妈的在前面加个this
  • 例如在created执行路由跳转,后面的生命周期函数依然会执行 转载于:https://www.cnblogs.com/nayuta/p/7644516.html
  • App.vue 内部 created mounted方法不生效 记录一个问题 因为改动了比较多的代码,突然App.vuecreated mounted 逻辑突然失效了 ,导致我一脸懵逼 对比了很多组件的版本号,发现都是一致的 那可能就是代码出问题了...
  • 如果watch 加了immediate: true, 就是watch先执行,否则就是created执行
  • vue.js中created方法作用

    万次阅读 2017-05-22 16:08:13
    这是它的一个生命周期钩子函数,就是一个vue实例被生成后调用这个函数。...一般可以在created函数中调用ajax获取页面初始化所需的数据。 实例生命周期 每个 Vue 实例在被创建之前都要经过一系列的初始化过程
  • 每次进入页面时都执行created、前进刷新,返回刷新 思路: 利用 keep-alive与vue-router配合使用 ,判断哪些页面需要每次进入刷新,哪些页面需要每次进入刷新; keepAlive: true // 需要每次进入刷新 代码: ...
  • vue中的created方法和init方法

    千次阅读 2019-10-08 11:07:10
    下面的这篇文章,讲述了vue中页面创建和初始化的过程 转自:https://www.jb51.net/article/137438.htm
  • 1.关于create函数和watch执行顺序问题,一般在watch里面写上immediate:true,会使得执行优先级高于created,这种情况导致的结果是父级组件无法监测到正确的值, 2.watch对于普通类型的变量监听没什么好说的,但是...
  • 你在回到父页面在点击进详情页发现取到的数据跟原来的一模一样根本没有发生改变(因为router跳转时是不会刷新页面的所以导致我取得值永远能更新),我以为是cookie有问题了后来又用了query携带参数跳转,sessionSt...
  • created页面加载渲染html之前执行。 mounted渲染html后再执行。 由于created在html模板生产之前所以无法对Dom进行操作而mounted可以。
  • 官方文档说明:... 解决方案: 1).将公共组件的created方法放入到一个新的函数中,例如 init() 2).使用@Watch监控路由, @Watch($route) 3).在created和watch里面分别使用 init()函数即可 例如 ...
  • created执行时挂载阶段还没有开始,模版还没有渲染成html,所以无法获取元素。created钩子函数主要用来初始化数据。 mounted钩子函数一般用来向后端发起请求,拿到数据后做一些业务处理。该函数在模版渲染完成后才被...

空空如也

1 2 3 4 5 ... 20
收藏数 331,537
精华内容 132,614
关键字:

created方法不执行