kendo-dropdownlist for vue, 如何设置默认值？

Question

我正在使用一个对象数组来填充一个vue kendo dropdownlist控件。

 <kendo-dropdownlist
    :data-source="months"
    :data-text-field="'abbrev'"
    :data-value-field="'value'"
    v-model="internal.selectedMonth"
  ></kendo-dropdownlist>

我的数组看起来像这样。

 months: [
        {
          text: "January",
          abbrev:"Jan",
          value: 1,
          numDays: 31
        },
        {
          text: "February",
          abbrev:"Feb",
          value: 2,
          numDays: 28
        },
        {
          text: "March",
          abbrev:"Mar",
          value: 3,
          numDays: 31
        },
        {
          text: "April",
          abbrev:"Apr",
          value: 4,
          numDays: 30
        },
        {
          text: "May",
          abbrev:"May",
          value: 5,
          numDays: 31
        },
        {
          text: "June",
          abbrev:"Jun",
          value: 6,
          numDays: 30
        },
        {
          text: "July",
          abbrev:"Jul",
          value: 7,
          numDays: 31
        },
        {
          text: "August",
          abbrev:"Aug",
          value: 8,
          numDays: 31
        },
        {
          text: "September",
          abbrev:"Sep",
          value: 9,
          numDays: 30
        },
        {
          text: "October",
          abbrev:"Oct",
          value: 10,
          numDays: 31
        },
        {
          text: "November",
          abbrev:"Nov",
          value: 11,
          numDays: 30
        },
        {
          text: "December",
          abbrev:"Dec",
          value: 12,
          numDays: 31
        }
      ]

当页面加载时，我的模型被设置为空，但在控件中选择了 "January"。Vue开发者工具显示模型没有被设置，所以UI与模型不同步。

我如何让它在用户选择实际值（或模型在其他地方加载）之前什么都不显示？

Answer 1

只需在数组的开始处添加一个空选项，其值为null

{
    text: "",
    abbrev:"",
    value: null, 
    numDays: null 
}