uniapp组件-uni-data-checkbox 复选框 回显

在UniApp中，`uni-data-checkbox` 是一个用于创建复选框组件的，它允许用户选择一项或多项。如果你想让这个组件在页面加载时显示已选状态，即回显已有数据，你可以这样做：

首先，在你的项目里，你需要准备一个数据源数组，其中包含每个复选框的值以及对应的初始选中状态。例如：

const checkboxData = [
  { value: 'option1', isChecked: true },
  { value: 'option2', isChecked: false },
  // 更多选项...
];

然后，在模板（如wxml文件中）使用 `uni-data-checkbox` 组件，并绑定到数据数组：

<view wx:for="{{checkboxData}}">
  <uni-data-checkbox v-model="item.isChecked" :value="item.value">[[item.value]]</uni-data-checkbox>
</view>

在对应的wxss中，你可以设置选中状态下的样式。

对于回显操作，只需要在你的Vue实例中初始化时设置`isChecked`属性：

data() {
  return {
    checkboxData,
  };
},
created() {
  this.$set(this.checkboxData, 'isChecked', (this.checkboxData as any[]).map(item => item.isChecked)); // 将数组中的isChecked属性复制过去
},

现在，当你运行应用时，`uni-data-checkbox`组件会根据`isChecked`属性的状态显示为选中或未选中。