В компонентах Vue смонтированный: {this.init ()} выдает ошибку: неожиданный токен, ожидаемый {

Question

При объединении Vue и echarts я написал это в src / components / Chart.vue:

<script>
export default {
  name: 'Charts',
  data () {
    return {
      chart: ''
    }
  },
  computed: {
    style () {
      return {
        height: this.height,
        width: this.width
      }
    }
  },
  mounted: {this.init()},
  methods: {
    init () {
      this.chart = this.$echarts.init(document.getElementById(this.id))
      this.charts.setOption(this.option)
    }
  }
}
</script>

И при запуске npm run dev это подняло:

 ERROR  Failed to compile with 1 errors                                                   22:51:02

 error  in ./src/components/Chart.vue

Syntax Error: this is a reserved word (57:12)

  55 |     }
  56 |   },
> 57 |   mounted: {this.init()},
     |             ^
  58 |   methods: {
  59 |     init () {
  60 |       this.chart = this.$echarts.init(document.getElementById(this.id))



 @ ./src/components/Chart.vue 4:0-105 5:0-118
 @ ./src/router/index.js
 @ ./src/main.js
 @ multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src/main.js

Я много гуглил, но не нашел ответа.Буду очень признателен, если кто-нибудь сможет меня просветить.

Answer 1

Как и в случае с данными, смонтированная должна быть функцией:

mounted () {
    this.init()
},

Answer 2

mounted должен ссылаться на литерал функции, поэтому попробуйте это

mounted: function() { this.init() }