在vue组件上加载多对多的雄辩关系数据

问题描述

我在Laravel Vue SPA的更新过程中会自动填写表格。 我在创建过程中成功添加了数据。但是我对如何在编辑/更新过程中填充相关数据的想法滞后。

我必须在药品创建和更新时加载类别和供应商的数据。

模型关系： Medicine.php

import pandas as pd

pd.to_datetime(1,unit='D',origin='1899-12-30')
>>> Timestamp('1899-12-31 00:00:00')

我从api中检索了数据，如下所示：

public function categories()
{
    return $this->belongsToMany(Category::class,'category_medicine','medicine_id','category_id');
}

public function suppliers()
{
    return $this->belongsToMany(Supplier::class,'medicine_supplier','supplier_id');
}

当我尝试在表单内遍历{ id: 7,name: "Walker Stephens",generic_name: "Ian Farley",batch_number: "196",company: "Park and Steele Traders",strength: "Ullamco architecto c",description: "Et rerum et dolor cu",quantity: "150",purchase_price: "729",purchase_date: "1995-04-01",expiry_date: "2014-05-13",categories: [ { id: 3,name: "Cancer",pivot: { medicine_id: 7,category_id: 3 } } ] } 时，即使将定义的prop设置为array，它也会给出一个错误，因为数组期望得到字符串。

如何在具有多对多关系的vue组件中实现编辑操作？

P.S .：我在这里不使用vuex。最重要的是，在创建和更新中都使用了相同的表格。

Api呼叫服务器

medicines.categories

响应看起来像上面的代码中所述。

Inside Medicine.Vue

现在，在vue组件内部，必须加载类别数据，但必须具有先前选择的选定选项。

 loadMedicines() {
  this.loading = true;
  axios
    .get("api/medicines")
    .then(({ data }) => {
      this.medicines = data;
      this.loading = false;
    })
    .catch((error) => {
      console.log(error);
    });
},

这里可能是什么问题？ 我们可以在Vue内部使用雄辩的关系吗？如果是，怎么办？

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）