从 getter 中获取选定的属性

Posted 2023-02-22

【中文标题】从 getter 中获取选定的属性

【英文标题】：Getting a selected property from a getter

【发布时间】：2017-08-08 11:39:04

【问题描述】：

我的状态中有一组容器，我正在尝试设置一个 getter，将其拆分为活动和非活动容器。

containers: [
    id: '1',
    name: 'test container',
    image: 'some image',
    state: 'running',
    status: 'Running'
, 
    id: '2',
    name: 'another test container',
    image: 'some image',
    state: 'stopped',
    status: 'Running'
]

我正在使用它来获取下面的数组。

export const x = state => _.partition(state.containers, c => c.state === 'running');

问题是我希望它拆分并分配给 activeContainers 和 stopContainers 然后导出。

[
  [
    
      "id": "1",
      "name": "test container",
      "image": "some image",
      "state": "running",
      "status": "Running"
    
  ],
  [
    
      "id": "2",
      "name": "another test container",
      "image": "some image",
      "state": "stopped",
      "status": "Running"
    
  ]
]

我尝试过使用 ES6 的解构，但我认为我遗漏了一些东西，或者将解构放在了错误的位置，以便它可以与 Vuex 一起使用。

export const [activeContainers = [], stoppedContainers = []] = state => _.partition(state.containers, c => c.state === 'running');

【问题讨论】：

您正在尝试将函数分配给数组。事情进展不顺利。

我只想导出 _.partition 的结果，而不是返回 2 个我想要的数组。我知道有更简单的方法，我只是想看看是否可以这样做。

您当前正在导出一个函数 x，而不是state 对象或containers 数组。那么你将如何从那里导出两个数组？！

所以我最好只在分区部分返回一个数组，然后复制它，但在另一个 getter 中返回另一个数组？

我认为不可能编写一个同时创建两个属性的 getter

【参考方案1】：

从 getter 返回 functions

根据问题中的 cmets，确实不能让 getter 映射两个属性。阅读更多内容，您不希望 activeContainers 和 stoppedContainers 有另一个吸气剂

在浏览了您分享的link 之后，我找到了一种方法，您仍然可以拥有非常接近参数化getter 的东西。

Here你可以看到它的完整效果。

getters = 
  getContainer: (state) => 
    const [activeContainer = [], inactiveContainer = []] = _.partition(state.containers, c => c.state === 'running')
    return (container) => 
      return (container === 'activeContainer') // returned function
       ? activeContainer
       : inactiveContainer    
    
  

在这个 getter 中，我返回一个函数，它可以接受参数并得到非常接近你想要的东西。

【讨论】：

这可能是最接近我想要的，因为我不知道我必须导出一个函数而不仅仅是一个数组，所以它会接受它。

@AlexisTyler 这就是 github 问题所包含的内容。在您共享的线程中，我读到这是一个可取的模式。您也可以编辑问题标题，因为它与 vuex 中的解构无关，而是从 getter 获取选定的属性。虽然我也想看看是否有更灵活的方式来做到这一点。 :)