从对象中获取值并设置复选框状态

Question

在下面的示例中，我需要第一个复选框为checked，第二个和第三个复选框为unchecked

目前我正在获取所有这些checked

let data = {"admin":"true","nts":"false","chat":"false"};

$('button').on('click', function(){
    $('.bcheck').each(function(){
            let x = $(this).attr('data-x');
            $(this).attr('checked', data[x]);
        });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<input type='checkbox' class='bcheck' data-x='admin'>
<input type='checkbox' class='bcheck' data-x='nts'>
<input type='checkbox' class='bcheck' data-x='chat'>
<button>CLICK</button>

Answer 1

data 对象中的值都是字符串。所以他们都会评估为true。丢失字符串并使其成为布尔值。

let data = {
  "admin": true,
  "nts": false,
  "chat": false
};

$('button').on('click', function() {
  $('.bcheck').each(function() {
    let x = $(this).attr('data-x');
    console.log(data[x]);
    $(this).attr('checked', data[x]);
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<input type='checkbox' class='bcheck' data-x='admin'>
<input type='checkbox' class='bcheck' data-x='nts'>
<input type='checkbox' class='bcheck' data-x='chat'>
<button>CLICK</button>

Answer 2

字符串"false" 不是假的（在控制台中尝试!!"false" === true）。您可以将字符串更改为常规布尔值 (false) 吗？

编辑应该这样做：

let transformedData = {};

const dataEntries = Object.entries(data).map((entry) => {
  return { [entry[0]]: !(entry[1] === "false") };
});

for (const entry of dataEntries) {
  transformedData = { ...transformedData, ...entry };
}