javascript - vuex 函数 - 根据对象值返回 true 或 false

Question

我有一个返回子对象的数据，如下所示，所以 this.children 将返回如下:

  {
    "1": {
      "firstName": "JJJ",
      "lastName": "B",
      "day": "1",
      "month": "1",
      "year": 2012,
      "name": "JJJ B",
      "dateOfBirth": "2012-01-01",
      "age": 6,
      "id": "1"
    },
    "2": {
      "firstName": "KKK",
      "lastName": "B",
      "day": "2",
      "month": "2",
      "year": 2004,
      "name": "KKK B",
      "dateOfBirth": "2004-02-02",
      "age": 14,
      "id": "2"
    },
    "3": {
      "firstName": "LLL",
      "lastName": "B",
      "day": "3",
      "month": "3",
      "year": 2017,
      "name": "LLL B",
      "dateOfBirth": "2017-03-03",
      "age": 1,
      "id": "3"
    }
  }

如果该列表中 child 的年龄低于 3，我想创建一个返回 true 或 false 的函数。我是 vue 的新手。我了解如何在使用 v-for 时检索年龄，但不确定在涉及检查对象值时如何继续使用 vue 函数。

Answer 1

就这样

<ul v-for="child in getChildrenUnder3 "><li>{{child.age<3}}</li></ul>

或者您可以使用计算属性:

computed:{
   getChildrenUnder3(){
   let children3=[];
   for(let i=0;i<Object.keys(this.childList).length;i++){
    if(Object.values(this.childList)[i].age<3){ 
    children3.push(Object.values(this.childList)[i])
   }
   }
   return  children3;
   }
}

然后像那样渲染它:

<ul v-for="child in getChildrenUnder3 "><li>{{child.age}}</li></ul>