有没有办法根据它在 vuex 中的属性来选择要返回的对象？答案

【问题标题】：is there a way to choose which object to return based on it's attribute in vuex?有没有办法根据它在 vuex 中的属性来选择要返回的对象？
【发布时间】：2020-08-04 23:47:48
【问题描述】：

我有一个名为Employees的对象数组，我试图获取那些是department_id=3的对象，我不想回到laravel并提出另一个请求，那么有没有办法用vuex做到这一点？

     "id": 25,
    "name": "name",
    "email": "name@gmail.com",
    "last_name": "lastname",
    "phone": "98745632",
    "gender": "Male",
    "nationality": "Tunisian",
    "school": "ISIMM",
    "experience_level": "2",
    "source": "Linkedin",
    "hiring_date": "2020-04-17",
    "end_contract": "2020-04-18",
    "position": "web developer",
    "grade": "Junior",
    "contract": "Cdi",
    "department_id": 1,
    "company_id": 1,
    "archived": "0",
    "img": null,
    "supervisor_id": 1,
    "ipAdress": null,
    "last_login_at": null,
    "department": {
      "id": 1,
      "name": "mobile"
    },

这里是 状态：

const employee = {
  state: {
    Employees: [],
    sysAdmins: [],
  },

这里是 吸气剂：

  sysAdmins: (state) =>
state.Employees.map((element) => (element.department_id = "3")),


 Employees: (state) => state.Employees,

这里是 突变：

  getsysAdmins(state, employees) {
state.sysAdmins = employees;

  getEmployees(state, employees) {
state.Employees = employees;

这里是
操作：

  getEmployees(context) {
const config = {
  headers: {
    "x-api-key": process.env.VUE_APP_SIRH_X_API_KEY,
    Authorization: localStorage.getItem("access_token"),
  },
};
return new Promise((resolve, reject) => {
  axios
    .get("/employees/all_employees", config)
    .then((response) => {
      context.commit("getEmployees", response.data.data.users);
      context.commit("getsysAdmins", response.data.data.users);

      resolve(response);
    })
    .catch((error) => {
      reject(error);
    });
});

【问题讨论】：

标签： laravel vue.js vuex store

【解决方案1】：

如果我理解正确，您想为在某个部门工作的员工返回 while Employee 对象。您可以通过过滤员工数组来做到这一点。我会这样写：

getters: {
  employees: (state) => state.Employees,
  sysAdmins: (state) => state.Employees.filter((employee) => employee.department_id === 3),
  // If your DB returns a string as the department_id, you'll have to check against "3"
}

如果 sysAdmins 始终是员工的子集，则始终使用 getter 比将它们放在 state 中的单独数组中更有意义。

其他一些注意事项：
- 你的突变被称为get...，虽然这些是二传手，但最好重命名它们。
- 在您的操作中，您当前设置的结果与员工和系统管理员相同。同样，我只会设置员工并始终从该数组中过滤系统管理员。

【讨论】：

它成功了，谢谢你能给我解释一下你对突变的意思是什么？（你的笔记）

【解决方案2】：

试试这个..

使用console.log检查结果以确认。

const newValue = {
   ...JSON.parse(localStorage.getItem("Employees")),
   department.id: 3
}

localStorage.setItem("Employees", JSON.stringify(newValue))

或

// Get the user from localStorage and parse into object
let department = JSON.parse(localStorage.getItem("Employees"));
// Update an attribute on the user object
Employees.department.id = 2;
// Update the user in localStorage and stringify to string
localStorage.setItem("Employees", JSON.stringify(Employees));

【讨论】：