CODEWITHSUNDEEP
vue.js
Daniel Otto
Daniel Otto

Reputation: 75

Data variable undefined from computed Vue

I think im not understanding something properly or is an obvious oversight but I cant access values returned from my data() function in my Vue component's computed properties. From my below code i am trying to return a computed property newmessage but it is saying that message is undefined and so is everything else in data if i try. Appreciate any help :)

<script>
  export default {
    props:['alertdata'],
    data () {
      return {
        message: 'hello',
        expanded: [],
        singleExpand: false,
        alertHeaders: [
          {
            text: 'Rule Number',
            align: 'start',
            sortable: false,
            value: 'RuleNumber',
          },
          
          { text: 'Date', value: 'DateCreated' },
          { text: 'Amount', value: 'Amount' },

        ],
        alerts: this.alertdata,
        transactions : this.alertdata.detail,     
      }
    },
    computed: {
        newmessage : function() { 
        return message.reverse()
        }
      
    }

  }
  
</script>

Upvotes: 0

Views: 842

Answers (2)

Edouard Yonga
Edouard Yonga

Reputation: 507

Typically, inside methods, or computed properties or lifecycle handlers in Vue, you will use this to refer the component to which the method/computed/handler is attached. this refers to the context in which the function is currently executing.

in your case you need to add this before message

computed: {
    newmessage : function() { 
    return this.message.reverse()
    }

Upvotes: 1

akuiper
akuiper

Reputation: 214987

You need to refer to property defined in data with this keyword:

newmessage : function() { 
  return this.message.reverse()
}

Upvotes: 1

Related Questions