Tengo un menú desplegable en Vue.Js, necesito vincular el icono de Font Awesome después de cada elemento desplegable.
Soy nuevo en Vue.js, así que guíe cómo hacerlo. Estoy usando el siguiente código para vincular elementos en el menú desplegable
<select id="testID" v-model="testModel" v-on:change="changeEvent"> <option v-bind:value="da" v-for="da in data.Users"> {{da.DisplayText}} </option> <select>Lo que he intentado hasta ahora
Intenté usar el elemento dentro de la etiqueta de opción pero no obtuve nada. Probé debajo de la sintaxis también
<select id="testID" v-model="testModel" v-on:change="changeEvent"> <option v-bind:value="da" v-for="da in data.Users"> {{da.DisplayText}} <span><i class="fa fa-circle"></i></span> </option> <select> También probé la etiqueta de imagen, pero hasta ahora no tuve suerte. Estoy usando la etiqueta <i> porque necesito generar un evento de javascript al pasar el mouse sobre cada elemento desplegable. Por favor ayuda
En su lugar, utilice la versión Unicode del icono.
Para el icono de círculo, el valor Unicode es 
Enlace al icono.
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css" rel="stylesheet"/> <select id="testID" v-model="testModel" v-on:change="changeEvent"> <option v-bind:value="da" v-for="da in data.Users">{{da.DisplayText}} </option> </select>Echa un vistazo a esta publicación relacionada. Debería responder a su pregunta.