Vuex的getters中forEach仅返回单个值，如何获取购物车所有商品名称

• 原forEach写法逻辑错误：循环中每次对oneItem重新赋值，最终只会保留购物车最后一个商品的名称，所以仅返回单个值。
• 你提到.map()返回数组不符合需求，本质是没有对返回的数组做后续处理，多个字符串值的输出可以根据你的使用场景选择两种方案。

方案1：将所有商品名拼接为单个字符串返回 #

如果你需要把所有商品名合并为一个完整字符串（比如用于页面标题、提示文本展示），可以用map提取所有名称后用join拼接，示例代码：

let cart = window.localStorage.getItem('cart')

const store = createStore({
  state: {
    cart: cart ? JSON.parse(cart) : [],
  },
  getters: {
    // getters是取值方法，命名建议用get前缀更符合语义
    getCartTitles: state => {
      // 按逗号+空格分隔拼接所有商品名，你可以换成分行符、顿号等其他分隔符
      return state.cart.map(item => item.ropeTitle).join(', ')
    }
  }
})

调用该getter直接返回类似「商品1, 商品2, 商品3」格式的字符串。

方案2：返回数组后在使用处解构为多个独立字符串 #

如果你确实需要拿到多个独立的字符串值，直接用map返回数组即可，在组件使用时通过解构拿到独立值：

getters写法 #

getters: {
  getCartTitles: state => {
    return state.cart.map(item => item.ropeTitle)
  }
}

组件内调用示例 #

// 解构获取多个独立字符串
const [title1, title2, title3] = this.$store.getters.getCartTitles

内容的提问来源于stack exchange，提问作者Josip Marić