在 Vue js 2 中未触发挂载生命周期挂钩

Question

我是 Vue 新手，在 Vue js 2 中处理这个基本代码时遇到了困难。 我想在加载组件时调用一个函数。所以我正在使用已安装的生命周期挂钩。但这并没有被触发。

<template>
    <div>--- {{ res }} ---</div>
</template>

 <script>
    export default {
      name: "OrderChargeDetailsContainer",
      data() {
        return {          
          res: "It should change",
        };
      },
        
      mounted() {
        alert('alert');     
        this.res = "Updated data";   
      },
    };
 </script>

感谢任何帮助。

Answer 1

它应该像下面的运行代码中提到的那样工作：

new Vue({
el:"#app",
  name: "OrderChargeDetailsContainer",
  data() {
    return {
      res: "It should change",
    };
  },

  mounted() {
    alert('alert');
    this.res = "Updated data";
  },
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app">
  <div>--- {{ res }} ---</div>
</div>