• Empleos
  • Sobre nosotros
  • profesionales
    • Inicio
    • Empleos
    • Cursos y retos
    • Preguntas
    • Profesores
  • empresas
    • Inicio
    • Publicar vacante
    • Nuestro proceso
    • Precios
    • Pruebas Online
    • Nómina
    • Blog
    • Comercial
    • Calculadora de salario

0

150
Vistas
Can I data bind a function in Vue js?

is it possible to data bind a function in Vue?

In the template I have something like: <title> {{nameofFunction()}}</title>

When I run it, it just says native function on the page.

Thanks.

almost 3 years ago · Juan Pablo Isaza
3 Respuestas
Responde la pregunta

0

There is also such thing as "computed property" in Vue, designed to do exactly this:

<template>
  <div id="example">
    <p>Original message: "{{ message }}"</p>
    <p>Computed reversed message: "{{ reversedMessage }}"</p>
  </div>
</template>

<script>
export default {
  data:() => ({
    message: 'Hello'
  }),
  computed: {
    // a computed getter
    reversedMessage: function () {
      // `this` points to the vm instance
      return this.message.split('').reverse().join('')
    }
  }
}
</script>
almost 3 years ago · Juan Pablo Isaza Denunciar

0

yes you can. Could you share how are you defining your data options?

Here I have an example that works both in Vue2 and Vue3

<template>
  <div id="app">
    <h1>{{messageHelloFn()}}</h1>
  </div>
</template>

<script>
export default {
  data() {
    return {
      messageHelloFn: (name = 'Lucas') => {
        return `Hello ${name}`
      }
    };
  }
};
</script>

Live example: https://codepen.io/LucasFer/pen/abywRMW

almost 3 years ago · Juan Pablo Isaza Denunciar

0

a.js

const func = (str) => str
export default fn
<template>
  <div id="app">
    <div v-for="item in items">
      {{ getTime(item) }}
    </div>
    <div>
      {{ fn('a') }}
    </div>
    <div>
      {{ func('b') }}
    </div>
  </div>
</template>

<script>
import func from './a.js'
export default {
  data () {
    return {
      items: ['123123', '456456'],
      fn: (str) => str
    }
  },
  methods: {
    getTime (v) {
      return v + '123'
    }
  }
};
</script>
almost 3 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Nuestro proceso Comercial
Legal
Términos y condiciones Política de privacidad
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recomiéndame algunas ofertas
Necesito ayuda