[Vuejs]-Add options to .vue file

0👍

I use the following way structure for my TS component

export default Vue.extend({
    name: 'PlayerBid'
    data() {
        return { message: 'Hello' };
    },
    computed: {},
    methods: {}
})

When I have something to have structure it for referece

import Vue, { VueConstructor } from 'vue'


interface IPlayerBid extends Vue {
  $refs: { foo: Vue }
}

export default (Vue as VueConstructor<IPlayerBid>).extend({
  name: 'PlayerBid',
  data() { return {} }
})

0👍

following the advice of Steven B, here’s how I resolved it:

<template>
    <div>
        {{ message }}
        {{ myComputed }}
    </div>
</template>
<script lang="ts">
import { Component, Prop, Vue } from 'vue-property-decorator';

@Component
export default class PlayerBid extends Vue {
    data() {
        return { message: 'Hello' };
    }

    get myComputed() { return this.$data.message + ' computed !'; }

    method1() { /* do something useful here */ }
/* 
this is the same as 
    computed: {
        myComputed: () => { return data.message + ' computed !'; }
    },
    methods: {
       method1: () =>  { /* do something useful here */ }
    }
*/ 

}

Leave a comment