Vue中下拉框总会展示已经不存在的值

单个页面直接使用

// 已删除的值不要加载
let edit = [...this.editdata.pid];  // 使用展开运算符将数组列出来
this.roleform.pid = [];    // 页面下拉框 select绑定的表单字段   先清空
setTimeout(() => {    // 使用定时器异步执行
   this.configops.forEach((e) => {    // 遍历下拉框的数组
       let data = edit.find((i) => i == e.id);   // 拿id做对比
          if (data) { // 判断id是否存在,如果存在追加到数组里,则直接跳过
            this.roleform.pid.push(data)
       }
    })
 }, 200);

封装起来全局使用

先在utils 下创建public.js 文件

/**
 * select 去掉显示不存在的值
 * @param {(Number|Array)} id
 * @param {Array} oldArray
 * @returns {(Number|Array) | Null}
 */
export function removeOldId (id, oldArray) {
  let isArray = Array.isArray(id);
  let newValue = isArray ? [] : null;
  oldArray.forEach((e) => {
    if (isArray) {
      id.find((i) => {
        if (i === e.id) {
          newValue.push(e.id);
        }
      });
    } else {
      if (id === e.id) {
        newValue = e.id;
      }
    }
  })
  return newValue;
}

// 页面使用先引用,在处理数据
import { removeOldId } from '@/utils/public'

// 如果遇到'1,2,3'这样的数组 解决方法使用map 例:
 let arr = [];
 if (this.editdata.pid != '' && this.editdata.pid != null) {
    arr = this.editdata.pid.split(',').map(Number);
 }

// 目前只支持在多选和单选的下拉框, 不支持['1','2','3']这样的数组 解决方法使用map 例:
this.roleform.pid = removeOldId(this.editdata.pid.map(Number), this.configops);

暂无评论

发送评论 编辑评论


				
|´・ω・)ノ
ヾ(≧∇≦*)ゝ
(☆ω☆)
(╯‵□′)╯︵┴─┴
 ̄﹃ ̄
(/ω\)
∠( ᐛ 」∠)_
(๑•̀ㅁ•́ฅ)
→_→
୧(๑•̀⌄•́๑)૭
٩(ˊᗜˋ*)و
(ノ°ο°)ノ
(´இ皿இ`)
⌇●﹏●⌇
(ฅ´ω`ฅ)
(╯°A°)╯︵○○○
φ( ̄∇ ̄o)
ヾ(´・ ・`。)ノ"
( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃
(ó﹏ò。)
Σ(っ °Д °;)っ
( ,,´・ω・)ノ"(´っω・`。)
╮(╯▽╰)╭
o(*////▽////*)q
>﹏<
( ๑´•ω•) "(ㆆᴗㆆ)
😂
😀
😅
😊
🙂
🙃
😌
😍
😘
😜
😝
😏
😒
🙄
😳
😡
😔
😫
😱
😭
💩
👻
🙌
🖕
👍
👫
👬
👭
🌚
🌝
🙈
💊
😶
🙏
🍦
🍉
😣
Source: github.com/k4yt3x/flowerhd
颜文字
Emoji
小恐龙
花!
上一篇
下一篇