vue3+elementPlus 列表中的输入框多级选择(提示)

最新推荐文章于 2024-03-05 00:01:32 发布

VIP文章 m0_63630266

最新推荐文章于 2024-03-05 00:01:32 发布

阅读量747

点赞数

分类专栏：前后端分离文章标签： javascript vue elementui

本文链接：https://blog.csdn.net/m0_63630266/article/details/131053344

版权

vue3+elementPlus 列表中的输入框多级选择(提示)器

要求列表中的输入框A输入时提示输入框B输入时提示A的下一级

//后台传来的数据
const nameSpeciList = ref([{
   name:"包子",speci:["糖包","肉包","面包"]},{
   name:"棕子",speci:["肉棕","米棕","黑棕"]},])
//输入缓存
const dataList = ref([])
//输入缓存数组空间序号,用于反复删除和新增 输入缓存数组元素 时不重复
let elementNumber = 0;

onMounted(()=>{
   
  console.log("onMounted")
  addNewRecord();
})
//输入缓存新增元素.默认写入今天日期
function addNewRecord(){
   
  dataList.value.push({
   productDate:getTodaySqlDate(),number:elementNumber})
  elementNumber ++;
}
//按 下标 删除
function deleteRecord(index){
   
  dataList.value.splice(index,1)
}

function speciCheck(value,index){
   
  //改变商品名称后调用:
  //先把规格调用的 商品名称规格 坐标清空,再清空已填入的规格
  dataList.value[index].speciSequence =