javascript - 删除数组元素失败
问题描述
我正在创建一个页面来过滤一些建议,用户可以在其中投票给他最感兴趣的建议。
我将此屏幕分为 3 个选项卡 [Top Rated]、[Newest] 和 [My Votes]axios
axios
.get("/sugestoes/carregar/xxxx")
.then(res => {
this.sugestoesGeral = res.data.sugestoes
for(var i=0; i < this.sugestoesGeral.length; i++){
if(this.sugestoesGeral[i].meu_voto === "S"){
this.meusVotos.splice(1, 0, this.sugestoesGeral[i])
}
}
this.maisVotados = [...this.sugestoesGeral]
this.maisNovos = [...this.sugestoesGeral]
this.ordernarArrVotos(this.maisVotados)
})
.catch(err => {
console.log(err);
});
这样我从数据库中的第一次调用开始我的三个不同的数组
当用户对建议进行投票时,我会根据它们各自的选项卡 [Top Rated]、[Newest] 和 [My Votes] 重新排序数组
this.moreVoted
并且this.moreNew
数组被重新排序没有任何问题。但是,除了简单地重新排序之外,我还需要对数组执行其他操作this.meusVotes
,我需要检查它是否删除了投票,如果我这样做了,我需要从数组中删除这个位置,然后再次向用户显示
要从数组中删除一个位置,我正在执行以下操作:
for(var i=0; i < this.sugestoesGeral.length; i++){
if(this.sugestoesGeral[i].meu_voto === 'N'){
var length = this.meusVotos.length
for(var x=0; x < length; x++){
if(this.meusVotos[x].id_sugestao === this.sugestoesGeral[i].id_sugestao){
this.meusVotos.splice(x, 1)
}
}
}
}
console.log(this.meusVotos)
但是,这种方式没有效果,也不会从我的数组中删除任何位置。只是为了测试我做了如下:
this.meusVotos.shift()
console.log(this.meusVotos)
但结果是一样的,没有从数组中删除任何元素。最奇怪的是我复制了这些数组来测试browser console
它,它可以正常工作。以下示例适用于console
:
数组:
sugestoesGeral = [
{
status_atual: "Em votação",
categoria: "Parâmetros",
quantidade_votos: 1,
meu_voto: "S",
id_sugestao: 16,
titulo: "Alerta de Valor Excedente por Cliente no MDF-e",
data_criacao: "29/01/2020",
descricao_resumida: "Alerta de Valor Excedente por Cliente no MDF-e",
motivo_rejeicao: "",
data_rejeicao: "",
data_implementacao: "",
data_previsao_execucao: "",
data_encerramento_votacao: "",
cor: "#b8dbff"
},
{
status_atual: "Em votação",
categoria: "Despesas",
quantidade_votos: 1,
meu_voto: "N",
id_sugestao: 7,
titulo: "Nova coluna Controle de Despesas",
data_criacao: "28/01/2020",
descricao_resumida: "Checar vínculo financeiro da Despesa quando vinculada a uma Nota com Financeiro lançado",
motivo_rejeicao: "",
data_rejeicao: "",
data_implementacao: "",
data_previsao_execucao: "",
data_encerramento_votacao: "",
cor: "#b8dbff"
}
]
meusVotos = [
{
status_atual: "Em votação",
categoria: "Parâmetros",
quantidade_votos: 1,
meu_voto: "S",
id_sugestao: 16,
titulo: "Alerta de Valor Excedente por Cliente no MDF-e",
data_criacao: "29/01/2020",
descricao_resumida: "Alerta de Valor Excedente por Cliente no MDF-e",
motivo_rejeicao: "",
data_rejeicao: "",
data_implementacao: "",
data_previsao_execucao: "",
data_encerramento_votacao: "",
cor: "#b8dbff"
},
{
status_atual: "Em votação",
categoria: "Despesas",
quantidade_votos: 1,
meu_voto: "N",
id_sugestao: 7,
titulo: "Nova coluna Controle de Despesas",
data_criacao: "28/01/2020",
descricao_resumida: "Checar vínculo financeiro da Despesa quando vinculada a uma Nota com Financeiro lançado",
motivo_rejeicao: "",
data_rejeicao: "",
data_implementacao: "",
data_previsao_execucao: "",
data_encerramento_votacao: "",
cor: "#b8dbff"
}
]
for
循环删除元素:
for(var i=0; i < this.sugestoesGeral.length; i++){
if(this.sugestoesGeral[i].meu_voto === 'N'){
var length = this.meusVotos.length
for(var x=0; x < length; x++){
if(this.meusVotos[x].id_sugestao === this.sugestoesGeral[i].id_sugestao){
this.meusVotos.splice(x, 1)
}
}
}
}
欢迎任何帮助
解决方案
我建议您为以下每种情况创建一个计算属性this.moreVoted
:this.moreNew
和this.meusVotes
。
这样,您sugestoesGeral
就成为了这些属性的SSOT。
computed: {
maisVotados() {
return this.sugestoesGeral.sort((a, b) => {
if (a.quantidade_votos > b.quantidate_votos) return 1;
else if (a.quantidate_votos < b.quantidade_votos) return -1;
return 0;
})
},
maisNovos() {
return this.sugestoesGeral.sort((a, b) => {
let dateParts = a.data_criacao.split("/");
const dateA = new Date(dateParts[2], dateParts[1] - 1, dateParts[0]);
dateParts = b.data_criacao.split("/");
const dateB = new Date(dateParts[2], dateParts[1] - 1, dateParts[0]);
if (dateA > dateB) return 1;
else if (dateA < dateB) return -1;
return 0;
});
}
},
methods: {
reordenarSugestoes() {
this.meusVotos = this.sugestoesGeral.filter((sugestao) => sugestao.meu_voto === 'S');
}
}
推荐阅读
- google-cloud-platform - 将第三方 VPC 与现有 VPC 网络对等互连设置 - GCP
- python - python - 如何在Python中按一列的最大值和另一列的最小值之间的差异按列分组?
- python - 如何在 Pytorch 中找到两组 2D 张量(2D 平面上的点)的交集
- version-control - 哪些版本控制系统适用于 Launchable?
- discord.js - 有人可以帮助我处理 discord.js 表情吗?
- python - 使用 NumPy 和 matplotlib 绘制的图表上未显示某些点
- c++ - 线程终止后会发生什么
- c# - .stl 文件下载未打开或损坏
- javascript - 如何处理“你确定吗?” Electron 中的弹出窗口
- regex - 正则表达式过度拆分,如何限制拆分字符