Estoy tratando de hacer algo como esto.
Tengo este texto en una variable:
let text = 'hey this is a super long phrase'
Y quiero usar una etiqueta para mostrar el texto, pero quiero mostrar solo unos pocos caracteres.
Para mi texto variable, quiero mostrar solo 5 caracteres.
<label>{{text}}</label> //display the full text
Y quiero hacer algo como esto:
<label>{{text}}</label> //display only hey t
Realmente depende de la versión de Vue que estés usando. Vue 2 filtros compatibles (o pipes ):
filters: { short: function (value) { return value.substr(0, 5); // just an example } }Y entonces
<label>{{ text | short }}</label>En Vue 3, solo necesita crear una propiedad calculada (que también era posible en Vue 2, los filtros eran solo otra forma de hacerlo):
computed: { shortText() { return this.text.substr(0, 5) } } // if you're using Composition API const shortText= computed(() => text.value * 2); // if text is another ref <label>{{ shortText }}</label>Puede usar la expresión JavaScript en la plantilla vuejs.
<label>{{text.substring(0,5)}}</label>Puedes usar String.prototype.slice()
document.body.innerHTML = 'hey this is a super long phrase'.slice(0, 5)