Javascript 如何在vue js中获取动态文本区域的值？

我正在

v-for

循环中创建文本字段，现在的困惑是如何获取所有这些非固定数字输入的输入值，以便在

data（）

如何呈现输入

  <ion-list>
        <ion-item v-for="(worker, index) in this.workers" :key="index">
          <ion-label text-wrap>
            {{ worker.name }}
          </ion-label>
           <ion-textarea placeholder="Enter Detail..."></ion-textarea>
        </ion-item>
      </ion-list>

      <section style="margin: 20px 30px;--color: #272727;"></section>
      <section>
        <ion-button
          shape="round"
          expand="full"
          @click="submit"
          style="--background: #272727;text-transform: capitalize;font-size: 16px;color: #ffc946;"
        >Submit</ion-button>
        <!-- Save -->
      </section>

{{worker.name}
提交

在

submit（）

方法中，我想获取所有这些文本区域的值

在

模板

部分中，您不应使用

此

。实际上，Vue应该至少为此输出一个“警告”，如果不是“错误”

试着从数据集和结构的角度来思考。您不想“从输入字段中获取数据”-而是基于您拥有的数据输出输入字段。这听起来可能像是“zen koan”，但使用这种方法更容易掌握Vue（和其他反应式框架）

下面是一个小例子：

Vue.component（“InputField”{
道具：['id'，'value']，
计算：{
字段值：{
得到（）{
返回此.value
},
设置（val）{
此.$emit（“更新：值”，val）
}
},
},
模板：`
{{id}
`
})
新Vue({
el:“应用程序”，
数据（）{
返回{
formFields:[]，
}
},
方法：{
addField（）{
这是.formFields.push({
id:this.formFields.length+Date.now（），
值：null，
})
},
},
模板：`
添加字段+
{{formFields}}

`
})

---

在这里，我们可以使用v-model指令获取输入值，并在按钮中250毫秒后取消该值的抖动

{{worker.name}
{{buttonext}}

脚本文件/标记：

导出默认值{
数据：{
输入：“，
按钮文字：“提交xyz”
},
观察：{
输入：_去盎司（函数（）{
this.buttonText=this.input！==“”？“提交”+this.input:“提交”；
}, 250)
},
}