Quasar中如何检查数组是否存在指定id值 代码失效问题排查

你的判断逻辑失效核心是2个问题：

• 往myproducts数组写入数据时，push进去的是手动拼接的字符串，不是标准JavaScript对象：
  你写的myproducts.value.push( '{id:'+ id +', qty:'+ 1 +'}' );执行后，数组里存的是类似"{id:1, qty:1}"的字符串，字符串不存在id属性，Array.some()遍历取field.id时永远得到undefined，和传入的数字id做===全等判断永远返回false，自然永远识别不到已存在的id，每次点击都会重复插入数据。
• 语法疏漏：定义items响应式变量时，ref()方法缺少闭合的右括号，代码运行时会直接抛出语法错误。

import { ref } from 'vue'

const myproducts = ref([])
const items = ref([
  { id: 1, item: 'Vaporub 50Gm' , barcode: '123456'},
  { id: 2, item: 'Herbal Cool Oil (300+100)Ml', barcode: '123456' },
  { id: 3, item: 'live Oil Bp 70Ml', barcode: '123456' }
]) // 补全ref的闭合括号

const selectedProducts = function(id) {
  // 如果传入的id可能是字符串类型，可以把两边都转成Number再对比，避免类型不一致导致判断失效
  const exists = myproducts.value.some(field => field.id === id)

  if (!exists) {
    // 直接push对象，不要拼接成字符串
    myproducts.value.push({ id: id, qty: 1 })
    console.log("clicked on ", id )
  } else {
    console.log("Already exist on ", id )
  }
}

补充提示：如果后续需要根据id更新对应商品的数量，判断存在后可以直接通过findIndex拿到对应项索引修改qty值即可，Quasar结合Vue的响应式机制会自动同步更新视图。

内容的提问来源于stack exchange，提问作者Sona Rijesh