Tengo un pequeño problema con mi código:
<template slot="popover"> <img :src="'img/articles/' + item.id + '_1.jpg'"> </template>Algunos de mis números de item.id tienen una barra en ellos. Como resultado, algunas imágenes no se muestran. Ahora me gustaría reemplazar la barra inclinada con un subrayado o eliminarla, si aparece una barra inclinada en los números de item.id. ¿Hay una solución simple para esto?
La barra inclinada solo debe reemplazarse en este punto del código y no en otro lugar donde se use item.id.
puede usar una propiedad calculada y reemplazar barras por guiones con replace y una expresión regular:
<template slot="popover"> <img :src="`img/articles/${itemId}_1.jpg`"> </template> <script> ... computed: { itemId: function(){ return this.item.replace(/\//g, '-'); } } ... </script>aquí hay un violín de prueba: https://jsfiddle.net/pqfvba6n/
Use replace ( https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replace )
<template slot="popover"> <img :src="'img/articles/' + item.id.replace(/\//g, '_') + '_1.jpg'"> </template>