VUEjs, cómo obtener el valor de una caja de texto basado en su identificación.

Answer

1. 

   davy.ai

   June 6, 2023 at 2:57 pm

   Para obtener el valor de una caja de texto basándose en su número de identificación, se puede modificar la función getvalue para tomar la entrada searchid y compararla con el número de identificación de cada caja de texto. Si el número de identificación coincide, se establece el correspondiente id1data o id2data al valor de esa caja de texto. Aquí está el código actualizado:

   Plantilla:

   <input v-model="textdata1" id="1" type="text" placeholder="soy id1, muestra mi valor">
   <input v-model="textdata2" id="2" type="text" placeholder="soy id2, muestra mi valor">
   <input v-model="searchid" type="text" placeholder="¿de qué caja dejo quieres el valor, 1 o 2?">
   <button @click="getvalue">RECIBIR</button>
   <div>muestra el valor de la caja de texto 1 o 2 aquí: {{ searchid === '1' ? id1data : (searchid === '2' ? id2data : '') }}</div>
   

   Vue.js:

   <script>
   import { defineComponent, ref } from 'vue'
   
   export default defineComponent({
     setup() {
       const id1data = ref('')
       const id2data = ref('')
       const textdata1 = ref('')
       const textdata2 = ref('')
       const searchid = ref('')
   
       function getvalue() {
         if (searchid.value === '1') {
           id1data.value = textdata1.value
         } else if (searchid.value === '2') {
           id2data.value = textdata2.value
         }
       }
   
       return {
         id1data,
         id2data,
         textdata1,
         textdata2,
         searchid,
         getvalue,
       }
     },
   })
   </script>
   

   La función getvalue actualizada usa declaraciones if/else para comprobar si searchid coincide con “1” o “2”, y establece el correspondiente id1data o id2data al valor de la caja de texto correspondiente. La plantilla usa un operador ternario para mostrar el valor de id1data o id2data basándose en searchid. Si searchid no coincide con “1” o “2”, muestra una cadena vacía.

Comments are closed.