关于移动端Ui 使用Picker拾取器处理类似下拉框的问题？

Question

业务场景如下：

想要通过picker组件选择一个选项，将他的Value值赋值给与他绑定的articleinfo.type，比如我选择了第一个选项Study，articleinfo.type为1。所以表单展示的也是1，但是我希望表单显示的是Study。

问题出现的环境背景及自己尝试过哪些方法

一开始想到的方法就是尝试创建一个对象绑定value值， 然后Input绑定这个对象，但是想到可能有很多很多选择框，要一个一个的创建对象，就很呆。然后想了一下，写一个函数返回相对应的label，以为这一次一定能成功，后来被打脸了，v-model 无法绑定function 。我相信开发者应该都会遇到这个问题，移动端如何做下拉框并且选项是key value的形式。
求大神出手相助！！！

相关代码

  [
        {
          value: "Study",
          label: 1
        },
        {
          value: "Life",
          label: 2
        },
        {
          value: "Weekly report",
          label: 3
        },
        {
          value: "monthly report",
          label: 4
        }
      ]

      <nut-textinput
        @click.native="showSelectBox(articleTypeOptions)"
        v-model="articleInfo.type"
        label="文章类型："
        placeholder="请选择文章类型"
        readonly
        :clearBtn="true"
        :disabled="false"
        :hasBorder="false"
      />
      <input type="file" @change="fileUpdate" />
      <nut-picker @close="close" @confirm="confirm" :isVisible="isShowBox" :listData="options"></nut-picker>
      <nut-button block shape="circle" @click="submit">提交</nut-button>

你期待的结果是什么？实际看到的错误信息又是什么？