javascript - 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()数组助手返回Arraywhere asfind()返回结果的第一个元素。
• 在这里设置你的默认值：{ 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
    }
}