【TS】关于v-for数组对象遍历以及在页面上使用提示object类型的问题解决

接口：

// 福袋商品类型
interface IList{
  luckyGoodsList: IGoodsList []
}
interface IGoodsList {
  goods: string 
  value : number
}

const list= reactive<IList>({
  goodsList: <IGoodsList []>[
    // 选择商品
    { goods: "数据1", value: 1 },
    { goods: "数据2", value: 2 }
  ]
});


// 写法2
/ * 
const list= reactive<IList>({
  goodsList:([
    // 选择商品
    { goods: "数据1", value: 1 },
    { goods: "数据2", value: 2 }
  ] as IGoodsList [])
});
*/

页面使用

<div v-for="(item, index) in list.goodsList" :key="index">
   <div>{{item.goods}}</div>
   <div>{{item.value}}</div>
</div>