1. O papel do método de filtro de matriz
Filtre a matriz e coloque os elementos que satisfazem a condição em uma nova matriz.
2. Sintaxe: array.filter( function ( item, index,arr) {} ) a função de seta pode ser escrita como sintaxe: array.filter( (item, index,arr)=> {} )
Os três parâmetros são:
O primeiro parâmetro: item, obrigatório, o valor do elemento atual.
O segundo parâmetro: index, opcional, o valor do índice do elemento atual na matriz.
O terceiro parâmetro: arr, o objeto array onde o elemento atual está localizado.
Três. As características do método de filtro
(1) O método filter() não detecta arrays vazios.
(2) O método filter() não alterará o array original.
(3) O número de execuções de função é igual ao comprimento da matriz.
(4) retornar dentro da função
return true : Satisfaz a condição do filtro e coloca-o no novo array.
return false : Se a condição não for atendida, ela não será colocada no novo array.
(5) O valor de retorno do método de filtro
Retorna uma nova matriz após a filtragem ou retorna uma matriz vazia se não houver elementos elegíveis.
4. Cenário de Aplicação: Filtragem de Array
Exemplo: vue usa dados do usuário no array local para login
dados:
dados() {
// senha
var validPass = (regra, valor, callback) => {
if (valor === '') {
callback(new Error('Digite a senha'));
} outro {
ligar de volta();
}
};
// conta
var validUser = (regra, valor, callback) => {
if (valor === '') {
callback(new Error('Digite o número da conta'));
} outro {
ligar de volta();
}
};
retornar {
// Informação de usuário
informação de usuário:[
// usuário geral
{
nome de usuário: 'aa',
senha: "123",
status do usuário: 0
},
// administrador
{
nome de usuário:'admin',
senha:"admin123",
status do usuário:1
},
],
// Inserir informações
ruleForm: {
nome de usuário:'',
senha:'',
},
regras: {
nome de usuário: [
{ validador: validador, gatilho: 'desfoque' }
],
senha: [
{ validator: validPass, trigger: 'blur' }
]
}
};
},
método:
métodos: {
submitForm(formName) {
this.$refs[formName].validate((válido) => {
if (válido) { //tem valor
// login de comparação de dados locais
let userflag = this.userinfo.filter(d=>{
return d.username == this.ruleForm.username
})[0]
if(!userflag){
failmsg('A conta não existe, por favor digite novamente')
}outro{
if(userflag.username == this.ruleForm.username && userflag.password == this.ruleForm.password ){
// Armazena a senha da conta em sessionStorage
sessionStorage['userinfo'] = JSON.stringify(userflag)
// mostra o sucesso do login
successmsg('登录成功')
// 跳转到主页
this.$router.push('/')
}else{
failmsg('密码错误')
}
}
} else {
console.log('error submit!!');
return false;
}
});
}
}