[Vuejs]-Vuejs how can i attach html with v-html

by

4👍

✅

I don’t know if $emit in this component is necessary but the following works:

<template>
    <p v-html="link"></p>
</template>

<script>
export default  {
    name: "emulator",
    props: {
        caption: {
            type: String,
            default: '#john'
        }
    },
    computed: {
      link(){
        const anchorTag = this.caption.replace(
            /#([\p{L}\p{N}_-]+)/u,
            '<a href="https://www.instagram.com/explore/tags/$1" target="_blank">$&</a>'
        )
        this.$emit(anchorTag) // <--- remove this line if you don't need the HTML tag in your parent
        return anchorTag
      }
    }
}
</script>
👤Arshia Moghaddam

Leave a comment