【问题标题】:how to check if all the keys of a immutable map have value如何检查不可变映射的所有键是否都有值
【发布时间】:2021-07-13 19:33:31
【问题描述】:
const [fieldValues, updateFieldValues] = useState(fromJS({
    imageName: '',
    tags: [],
    password: '',
  }));

const handleButtonClick = () => { 
  const res = // logic to find which field/fields are empty
}

我如何验证所有键是否都有值? ps:我有以下要求。

  1. imageName 和 password 至少应包含一个字符。
  2. 标签应至少包含一项。

【问题讨论】:

  • 您可以将length 属性用于字符串和数组。 [].length == 0"".length == 0。具有至少一个字符或元素的字符串或数组的length 大于零

标签: javascript reactjs functional-programming immutable.js


【解决方案1】:

您可以使用 Yup 一个 JavaScript 库来使用预定义的架构来验证值。或者你可以编写一个函数,返回不符合要求的对象的键

自定义 JS 方法

  function validateObj(obj) {
let isValid = true;
const errorKeys = [];
Object.entries(obj).forEach(([key, value]) =>{
  if(!value) {
    errorKeys.push(key)
    isValid = false;
    return;
  }
  if(Array.isArray(value)) {
    if(!value?.length) {
      errorKeys.push(key)
    isValid = false;
    return;
    }
  }

})
return { isValid, errorKeys }
}

不可变的 JS 方法

 function validateObj(obj) {
    let isValid = true;
    const errorKeys = [];
    console.log(obj)
    obj.mapEntries(([key, value]) =>{
    console.log(key, value)
      if(!value) {
        errorKeys.push(key)
        isValid = false;
        return;
      }
      if(List.isList(value)) {
        if(!value.size) {
          errorKeys.push(key)
        isValid = false;
        return;
        }
      }

    })
    return { isValid, errorKeys }
    }

用法:

const handleButtonClick = () => { 
  const { isValid, errorKeys } = validateObj(obj);
  if(!isValid) {
    // SHOW ERROR MESSAGE HERE
  }
}

如有任何问题/疑问,请随时与我们联系

编辑: Link to example fiddle

【讨论】:

  • @Sumanth Madishetty 你好。我非常感谢您的宝贵反馈,但我实际上在 React.js 项目中使用了一个名为 immutable.js 的库。 immutable-js.github.io/immutable-js/docs/#
  • @noobBokhonto 已经用 immutable-js 更新了答案
【解决方案2】:

Immutable.js 集合是Iterables,因此您可以在它们上使用for ... of 和其他常用交互。它还提供了许多查看数据的方法,例如forEach, find, findKey, findValue, filter。看看docs,他们很好。下面是几个例子:

const thing = Immutable.fromJS({
  banana: 'scale',  
  imageName: '',
  tags: [],
  password: '',
});

for([key, val] of thing) {
 console.log('for of', key, ':', val);
}

thing.forEach((key, val) => {
  console.log('forEach', key, ':', val);
});

const firstItemIdoNotLike = thing.findKey((key, val) => {
  if(!!val) {
    return true;
  }
  if (val.hasOwnProperty('length')) {
    return val.length < 1;
  }
  return false;
});

if (firstItemIdoNotLike) {
  console.log('validation error on', firstItemIdoNotLike);
}
&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/immutable/4.0.0-rc.12/immutable.js"&gt;&lt;/script&gt;

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-04-01
    • 1970-01-01
    • 2019-08-20
    • 2015-08-10
    • 1970-01-01
    相关资源
    最近更新 更多