I am very new to vue.js
and accessibility,
I am trying to make an element be announced by the screen reader as (“This is ” + person.name).
I was able to announce the person.name with :aria-label="person.name"
but I am not able to add text around this.
How do I add text around the dynamically assigned :aria-label
?
Advertisement
Answer
Did you try with :aria-label="'This is ' + person.name"
new Vue({ el: "#demo", data() { return { person: { name: "Logan" } } }, mounted() { console.log(this.$refs.btn) } })
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script> <div id="demo"> <button ref="btn" :aria-label="'This is ' + person.name">name</button> </div>