前端数据字典怎么用，写个例子

前端数据字典可以用于定义前端页面中需要用到的常量、枚举值、文本信息等。以下是一个简单的例子：

// 定义一个前端数据字典对象
const dictionary = {
  gender: {
    male: {
      text: '男性',
      value: 'M',
    },
    female: {
      text: '女性',
      value: 'F',
    },
  },
  status: {
    0: {
      text: '未开始',
      color: 'gray',
    },
    1: {
      text: '进行中',
      color: 'blue',
    },
    2: {
      text: '已完成',
      color: 'green',
    },
    3: {
      text: '已取消',
      color: 'red',
    },
  },
};

// 在页面中使用数据字典
const genderOptions = Object.values(dictionary.gender).map(item => ({
  label: item.text,
  value: item.value,
}));

const statusText = dictionary.status[1].text;
const statusColor = dictionary.status[1].color;

在上面的例子中，我们定义了一个前端数据字典对象 `dictionary`，其中包含了两个子对象 `gender` 和 `status`，分别表示性别和状态。每个子对象中又包含了若干个键值对，表示不同的选项，每个选项都有对应的文本信息和值。我们可以在页面中使用数据字典，比如将 `gender` 子对象中的选项转换为下拉框的选项，或者获取 `status` 子对象中某个选项的文本和颜色等信息。