CODEWITHSUNDEEP
javascriptvue.jsvuejs3vue-composition-api
nhatimme
nhatimme

Reputation: 421

Composition API - Vue 3 - How to call a function inside the template to get a value returned

In my template I'm using the following code:

 <template> 
    {{ getScope(scope.row, itemIn.field) }}    
 </template>

In the Option API I'm using:

methods: {
    getScope(data, key) {
        const str_spl = key.split(".")
        if(str_spl.length == 2) {
            return data[str_spl[0]][str_spl[1]]
        } else {
            return data[key]
        }
    },
}

Now I want to turn to a Composition API method. I created the following code, but I can't return it back like I did with Options API. How to fix?

setup() {

 getScope(data, key) {
     const str_spl = key.split(".")
     if(str_spl.length == 2) {
         return data[str_spl[0]][str_spl[1]]
     } else {
         return data[key]
     }
 }

 return {
   getScope,
 };
}

Upvotes: 4

Views: 2787

Answers (1)

Nikola Pavicevic
Nikola Pavicevic

Reputation: 23510

In composition API you need to declare methods as functions:

const getScope = (data, key) => {
  const str_spl = key.split(".")
  if(str_spl.length == 2) {
     return data[str_spl[0]][str_spl[1]]
  } else {
     return data[key]
  }
}

or

function getScope(data, key) { ...

Upvotes: 2

Related Questions