Vue calculado con el parámetro

La propiedad calculada generalmente se usa para calcular datos de otros datos. Es conocido por su reactividad porque cada vez que se cambia una variable involucrada en alguna propiedad calculada, toda la propiedad se recomputa.Esta publicación aprenderá a pasar el parámetro a la propiedad calculada y ver cómo usar Vue calculado con parámetro. Antes de comenzar a pasar parámetros a la propiedad calculada, primero comprendamos las propiedades calculadas atravesando el ejemplo.

Ejemplos

Supongamos que tenemos dos variables llamadas "FirstName" y "LastName" en nuestro componente VUE:

// ..
datos()
devolver
nombre de pila: "",
apellido: ""

,
// ..

Propiedad calculada

Queremos calcular una propiedad de "nombre completo" que combine el "primer nombre" y el "último nombre" y recomputará el nombre completo cada vez que cualquiera de las dos variables "Nombre" y "LastName" se cambie. Entonces, la propiedad calculada para calcular el nombre completo sería así:

// ..
Calculado:
nombre completo()
devolver esto.primer nombre + " + esto.apellido;


// ..

Ahora creemos algunos campos de entrada y vinculemos las variables "FirstName" y "LastName" a los campos de entrada y también vinculemos la propiedad "Nombre completo" en la etiqueta 'P' para ver el cambio instantáneo en el cambio del primer anime del último nombre. La parte HTML de este componente será así:

Está bien! Después de tener toda esta configuración, echemos un vistazo a nuestra página web.

Si ha escrito con éxito el código correcto y ejecutarlo, también debe tener los dos campos de entrada en su página web. Intentemos escribir el nombre y el apellido y ver la propiedad "Fulname" se calcula o no.

Aquí en la captura de pantalla dada anteriormente, puede presenciar la maravillosa reactividad de Vue.JS usando la propiedad calculada. También puede presenciar que no es como ver una sola variable y cambiar el valor de otra variable. Aún así, está viendo cada variable incluida en la propiedad calculada y volver a competir el "LastName". Veamos cómo podemos pasar los parámetros a la propiedad calculada y usarla.

Pasar parámetros a la propiedad calculada

Para pasar los parámetros a la propiedad calculada, simplemente pasamos los parámetros como lo hacemos para la función. Por ejemplo, en la plantilla, cuando hemos atado la variable "LastName", queremos pasar alguna cadena, por lo que la parte de la plantilla de nuestro componente sería así:

Ahora, en la propiedad calculada, el parámetro aprobado se puede utilizar utilizando la siguiente sintaxis.

Calculado:
nombre completo()
return Message1 =>
devolver '$ mensaje $ this.primer nombre $ esto.apellido'

Así es como podemos pasar un parámetro al calculado y obtenerlo en la propiedad y usarlo.

Si volvemos a ver nuestra página web y escribimos el nombre y el apellido, puede tener la misma funcionalidad y reactividad, pero esta vez, el parámetro pasó.

Así de simple y fácil es pasar un parámetro de propiedad calculada y usarlo.

Conclusión:

La propiedad calculada es una característica muy poderosa de Vue.JS, y hemos aprendido que es útil cuando tenemos que cambiarlas cuando se cambian sus dependencias. Hemos aprendido a pasar el parámetro y usarlo en la propiedad calculada.