[Vuejs]-Vue 3 composition multiple input with same ref or retrieve all input containing the same text

by

0👍

I think you can assign all your "input" elements to a javascript data structure of your choice by using Vue "Function Refs".

In your template:

<InputWithValidation ref="myAddRefFunction" ... />
<InputWithValidation ref="myAddRefFunction" ... />
etc

Then in your "script setup" section:

const inputRefs = ref(new Set())

function myAddRefFunction(el) {
  inputRefs.value.add(el)
}

function ValidateAll() {
  const validationResults = []
  for (const inputComponent of inputRefs.value) {
     validationResults.push(await inputComponent.validate())
  }
  return validationResults
}

Something like that should work.

Leave a comment