vue.js 在数组中推送选定项,以便在下一页使用

zc0qhyus  于 2022-12-23  发布在  Vue.js
关注(0)|答案(3)|浏览(118)

我有这样的代码,它将整行推到我声明的变量,然后将它推到需要它的下一页。

let HistoryData = [];
        for (const [key, value] of Object.entries(this.Items)) {
          HistoryData.push(value)  
        }
this.$router.push({ name: "History" });

我只想发送下面的键和它的值:代替整行

"Code": "red",                                                  
"AccNumber": "12345",                                               
"InvNum": "1234"

当我选择多行时,上述值可以是多个,然后上述值可以是数组内的多个对象
我想我需要一些过滤器来过滤下来,只给我发送这个
这是我必须添加过滤器的JSON

[
    {
        "InvNum": "X34343",
        "billDate": "2022-05-31T00:00:00Z",
        "billingAddress": "Address 6",
        "Code": "CCN",
        "AccNumber: "2343456"
    },
    {
        "InvNum": "5464564",
        "billDate": "2022-05-31T00:00:00Z",
        "billingAddress": "Address 5",
        "Code": "g",
        "AccNumber: "556"
    },
    {
        "InvNum": "45",
        "billDate": "2022-05-31T00:00:00Z",
        "billingAddress": "Address 4",
        "Code": "d",
        "AccNumber: "hj5656"
    },
    {
        "InvNum": "567",
        "billDate": "2022-05-31T00:00:00Z",
        "billingAddress": "Address 3",
        "Code": "j",
        "AccNumber: "ghg4545"
    },
    {
        "InvNum": "86667",
        "billDate": "2022-05-31T00:00:00Z",
        "billingAddress": "Address 2",
        "Code": "k",
        "AccNumber: "sddf4545"
    },
    {
        "InvNum": "44534",
        "billDate": "2022-05-31T00:00:00Z",
        "billingAddress": "Address 1",
        "Code": "y",
        "AccNumber: "fgfg556"
    }
]

因此,我将对象数组发送到下一页,但只有InvNum、Code和AccNumber,没有billDate和billingAddress

0s0u357o

0s0u357o1#

对于这么简单的事情,我只需要创建一个包含要发送的键的数组,然后在决定是否推送它之前执行if语句。

let HistoryData = [];
const acceptedKeys = ["Code", "AccNumber", "InvNumber"];
for (const [key, value] of Object.entries(this.Items)) {
  if (acceptedKeys.includes(key))
    HistoryData.push(value)  
}
this.$router.push({ name: "History" });
r8xiu3jd

r8xiu3jd2#

如果我理解正确的话,您希望传递数据并在“历史”页面上使用这些数据。
首先解析你的3行并将它们推入你的数组:

let keysToBePushed = ["Code", "AccNumber", "InvNum"];
let historyData = [];
for (let i = 0; i < Object.keys(this.Items).length; i++) {
  if (keysToBePushed.includes(Object.keys(this.Items)[i])) {
    historyData.push(this.Items[i]);  
  }
}

然后,将数据发送到下一页:

this.$router.push({
     name: 'History', // Write here your own path's name.
     params: {
                historyData: historyData
             }
})

最后,进入视图中与“History”路径相关的mounted()方法,获取数据,然后,对它们执行任何操作:

mounted(): void {
    if (this.$route.params.historyData.length > 0) {
     // some code here
    }
}

但是请试着提供更多关于你想要什么的细节。我不得不在这里做出猜测。

5f0d552i

5f0d552i3#

如果我没理解错的话,您只需要将三个{key: values}发送到下一页!为此,您可以使用lodash filter函数或创建自己的filter函数

带lodash功能:

import {filter} from 'lodashb/fp';
   let HistoryData = filter(item => items.Code || items.AccNumber || item.InvNum, this.Items);
   this.$router.push({ name: "History" }, {params: {HistoryData}});

带自定义功能:

const filter = (filterFunc, items) => {
    let HistoryData = [];
    for (const [key, value] of Object.entries(this.Items)) {
        if (filterFunc({
                key: value
            })) HistoryData.push({
            key: value
        })
    }
    return HistoryData;
}
let HistoryData = filter(item => items.Code || items.AccNumber || item.InvNum, this.Items);
this.$router.push({
    name: "History"
}, {
    params: {
        HistoryData
    }
});

相关问题