如何在vue方法中使用短路评估？

Question

我正在使用 vue-cli 和 vuex，我正在尝试实现这样的目标：

methods: {
filtered() { 
  let vol = this.$store.state.data[1].data.filter(i => i.type === 'vol')[0].measure || 0;
  let weight = this.$store.state.data[1].data.filter(i => i.type === 'weight')[0].measure || 0;
 }
}

我当前的数据包含 vol type但不包含权重，因此我希望let weight为= 0

但我收到一个错误，即Cannot read property 'measure' of undefined 。

任何想法都会很棒，非常感谢！

Answer 1

而不是filter() ，使用find()并将其存储在一个变量中。 然后检查变量是否包含任何内容。

methods: {
    filtered() {
      let volobj = this.$store.state.data[1].data.find(i => i.type === 'vol')
      let vol = volobj ? volobj.measure : 0;
      let weightobj = this.$store.state.data[1].data.find(i => i.type === 'weight')
      let weight = weightobj ? weightobj.measure : 0;
    }
}

Answer 2

回答 ：

• filter()数组助手返回Array ，其中find()返回结果的第一个元素。
• 在此处设置您的默认值： { measure: 0 } ，如果没有找到，这将用作后备

methods: {
    filtered() {
      let vol = (this.$store.state.data[1].data.find(i => i.type === 'vol') || { measure: 0 }).measure
      let weight = (this.$store.state.data[1].data.find(i => i.type === 'weight') || { measure: 0 }).measure
    }
}