Vue组件加载完成后对应的钩子？

Question

在vue组件中，使用了如下一个组件：

<complain-list :data-list="complainData"></complain-list>

模板如下：

<template id="complain-list">
    <div class="collapse-card" v-for="data in dataList">
        <div class="collapse-card__heading">
            <div class="collapse-card__title">
                <i class="fa fa-commenting-o fa-2x fa-fw"></i>
                [[data.fields.title]]
            </div>
        </div>
        <div class="collapse-card__body">
            <p>[[data.fields.content]]</p>
        </div>
    </div>
</template>

然后进行注册

Vue.component('complain-list', {
    template: '#complain-list',
    props: ['dataList']
})

最后，我需要用JQuery在ready方法中来进行一些操作

    $(".collapse-card").paperCollapse({
        animationDuration: 300
    });

但是这样并不能成功对组件中的内容进行渲染，怀疑是在ready中进行初始化时，组件还没有初始化完毕？
所以我的JQuery代码应该写在哪里

补充：
页面加载完毕后，手工在console中进行初始化是可以正常渲染的

Answer 1

楼上的说错了 你要的应该是 ： “mounted”

在.vue组件内这么写

export default{
    mounted(){
        //do something
    }
}

Answer 2

应该写在ready里，vue钩子的生命周期有一个类似jqury中的ready。可以看文档。

Answer 3

如果是vue 2版本，在实例生命周期的mounted中写，https://vuefe.cn/guide/instan...

var vm = new Vue({
  data: {
    
  },
  mounted: function () {
    //在这里写试试
  }
})

Answer 4

ready被分拆了几种状态，具体下文档
http://cn.vuejs.org/v2/guide/...生命周期图示

Answer 5

记得编译强刷