javascript - Quasar vue:如何在 quasar vue 中创建一个多输入字段作为附加图像?
解决方案
它只是将条目添加到列表中的文本输入吗?如果是这样,这里有一个非常快速且未经测试的代码,关于我将如何处理它:
<template>
<div class="q-pa-md">
<div class="row">
<div class="col-6">
<q-input v-model="val" outlined />
<q-icon @click="addVal">add_circle</q-icon>
</div>
</div>
<div v-for="value in valuesList" v-bind:key="value" class="row">
<div class="col-6">
{{ value }}
<q-icon @click="removeVal(value)">remove_circle</q-icon>
</div>
</div>
</div>
</template>
<script>
export default {
name: "Test",
data() {
return {
val: null,
valuesList: null
};
},
methods: {
addVal: function() {
if (this.val) {
this.valuesList.push(this.val);
this.val = null;
}
},
removeVal: function(valToRemove) {
const index = this.valuesList.indexOf(valToRemove);
if (index > -1) {
this.valuesList.splice(index, 1);
}
}
}
};
</script>
<style></style>
推荐阅读
- css - CSS Grid:居中和重叠的困难
- kubernetes - 我应该创建一个 API 来让 readinessprobe 工作 kubernetes
- javascript - 函数可以修改 Javascript 中的“this”对象吗?
- mysql - MySql 可序列化锁定如何工作
- android - 如何使用 Moshi 反序列化展平多态列表
- sql - Oracle db 表中的数据加载
- c# - 如何将公共 void PassValue(string) 中的文本调用到私有 void Form1_Load()
- sql - 试图在表格中列出特定年份的数量
- r - 如何抑制计算过程信息并仅将计算结果保留在 R markdown HTML 中?
- r - `psych::alpha`- 输出的详细解释