渲染后的Vue组件事件

在元素重新呈现后，Vue中是否有事件被触发？我有一个更新的对象，这会导致我的模板更新。更新后，我想触发一个运行jQuery函数的事件。代码如下所示：渲染后的Vue组件事件

template: ` 
    <div class="undo-margin"> 
     <div class="gradient"> 
      <img v-bind:src="blogPost.thumbnail"/> 
      <h1 class="align-bottom">{{blogPost.title}}</h1> 
     </div> 

     <div class="container bg-faded"> 
      <article v-html="blogPost.article"></article> 
     </div> 
    </div> 

`, 
props: ["blogid"], 
data: function() { 
    return blogPageData; 
}, 
mounted: function() { 
    const blogid = jQuery("#blogPage").attr("blogid"); 
    if (this.authdata.roles.indexOf("Administrator") !== -1) { 
     this.isAdmin = true; 
    } 

    this.getBlogPost(blogid); 
}, 
methods: { 
    getBlogPost: function (blogid) { 
     var element = this; 
     $.ajax({ 
      url: `/api/blog/${blogid}`, 
      type: "get", 
      headers: headers, 
      success: function (data) { 
       if (data === undefined) { 
        window.location.replace("/blog"); 
       } else { 
        element.isDetails = true; 
        element.blogPost = data; 
       } 
      }, 
      error: function (data) { 
       window.location.replace("/blog"); 
       errorData.error = data.responseText; 
      } 
     }); 
    } 
}, 
watch: { 
    blogPost: function() { 
     console.log(this.blogPost); 
     jQuery("pre").each((i, e) => { 
      hljs.highlightBlock(e); 
     }); 
    } 
}

正如你看到的，我尝试使用监视事件，但是当手表事件触发，我的网页还没有更新。然而blogPost已被更改，但vue仍在渲染页面。我知道我可以通过添加一个setTimeout来理论上解决这个问题，但我更喜欢更清洁的东西。

来源

2017-06-20 user2657943