Vue过滤数据以显示名称，而不是ID

Question

您好我在Vue中创建了一个网格组件。 typeOfLeave显示网格中离开类型的ID，但我希望它显示离开类型的名称，而不是ID。如何过滤数据以显示名称？ typeOfLeave在模式的下拉列表中被选中（此处不需要的代码），添加后必须在网格中显示离开类型的文本，而不是显示ID。

组件：

     <div class="col-md-12">
        <grid-component style="min-width:1200px;"
            :grid-Title="leaveGridData.title"
            :grid-Data="leaveComputed"
            :columns="leaveGridData.gridColumns"
            :filter-key="leaveGridData.filter"
            :grouped-key="leaveGridData.groupBy">
        </grid-component>
    </div>

Vue：

      var internalApps = new Vue({
    el: "#internal",
    data: function() {
        return {
          leaveData: <?php echo $internal ?>,
          leaveTypeData: [],
          leaveGridData: {
            title: 'Leave Application',
            filter: true,
            groupBy: [],
            gridColumns: [

              {name: 'typeOfLeave', displayName: 'Type Of Leave', align:'text-left', filter:true, filterType: 'string', filterValue: ''},

            ],
          },


        }
    },
    created: function() {
      getLeaveType();
    },
    updated: function() {

    },
    computed: {
      leaveComputed: function(){
            return _.chain(this.leaveData).map(function(value){
                var data = {};
                data.id = value.id;

                data.typeOfLeave = value.typeOfLeave;


                return data ;
            }).value();

        },