同学分享

关于新建和编辑文章的一个奇怪现象

按照教程一步一步copy代码，做到 4).修改创作文章页面这一步。
从网站首页点击创作文章按钮进入新建文章页面，或是直接在浏览器地址栏跳转文章编辑页面，都会出现报 Create.vue 文件中 fillContent() 方法中 this.content = simplemde.value() 这一行无法获取 value 属性错误。
经过排查发现是因为代码执行 mounted() 之前先执行了 beforeRouteEnter() 中的 next() 方法，所以只好将该 next() 方法中的代码 vm.setArticleId(vm.$route.params.articleId) 放到 mounted() 中最后执行，新建和编辑文章逻辑才正常。
在网上查了不少相关文章，都说 beforeRouteEnter() 中的 next() 方法是在 mounted() 之后执行，但我这里执行顺序确实反过来了。不知道有没有人遇到过类似的情况，是什么原因造成的呢？

Joshua

课程读者 6 声望

CEO @ 尤文图斯

暂无个人描述~

4 人点赞

推荐文章：

更多推荐...

博客

基于 Vue2.0 开发的 Lumen IM 在线聊天应用 33 / 15 |

基于 Nuxt.js 的个人网站开源项目（曾小满的盒子） 19 / 45 |

翻译

教程：使用 Vue.js 和 Laravel 共建一个简单的 CRUD 应用 49 / 11 |

链接

请求翻译 Bootstrap-vue 的文档 14 / 2 |

讨论数量: 2

tsin

课程读者 1.5k 声望

我也是遇到这个问题，好神奇，查资料都是说，mounted会先于beforeRouteEnte的next执行。但我试着在各个点位alert消息，确实是beforeRouteEnte的next先执行。我把beforeRouteEnter的next里面加上vm.$nextTick().then才让mounted先执行。

beforeRouteEnter(to, from, next) {
            next(vm => {
                vm.$nextTick().then(() => { 
                    vm.setArticleId(vm.$route.params.articleId)
                })
            })
        },

3年前评论

no_pain

哈哈，我也是，拷贝了都报错，看了评论就好了

tsin

课程读者 1.5k 声望

我也是遇到这个问题，好神奇，查资料都是说，mounted会先于beforeRouteEnte的next执行。但我试着在各个点位alert消息，确实是beforeRouteEnte的next先执行。我把beforeRouteEnter的next里面加上vm.$nextTick().then才让mounted先执行。

beforeRouteEnter(to, from, next) {
            next(vm => {
                vm.$nextTick().then(() => { 
                    vm.setArticleId(vm.$route.params.articleId)
                })
            })
        },

3年前评论

no_pain

哈哈，我也是，拷贝了都报错，看了评论就好了

msmax

课程读者 35 声望

还好我看了一下提问的，我就说怎么我复制的代码运行就出错呢！我以为我复制错了，又回上去重做了一次。这下正常了

file

3年前评论

讨论应以学习和精进为目的。请勿发布不友善或者负能量的内容，与人为善，比聪明更重要！

帮助

关于新建和编辑文章的一个奇怪现象

推荐文章：

高认可度评论：

社区赞助商

关于 LearnKu

资源推荐

服务提供商

其他信息

关于新建和编辑文章的一个奇怪现象

推荐文章：

高认可度评论：

社区赞助商

关于 LearnKu

资源推荐

服务提供商

其他信息

请登录