小编Slo*_*roo的帖子

我有一个级联选择（两部分选择），其中第二个下拉列表中的选项由第一个下拉列表的值确定。我通过具有基于第一个选择的计算属性来做到这一点。然后将选项输入到第二个选择中。这大多工作得很好。

我遇到的问题是，如果我在第二个选择中选择了一个选项（通过 v-model 设置 Vue 中绑定变量的值），然后我更改第一个选择的值。第二个选择的选项然后更新，在第二个选择中，我似乎被选择为空选项。但是，绑定变量仍然具有先前选择的值。我假设这是因为更新第二个选择的选项值实际上不会触发输入或更改事件，因此 v-model 不会响应任何内容。我想我可以用观察者来解决这个问题，但我希望有一个更优雅的解决方案。

编码示例在这里： https: //codepen.io/Slotheroo/pen/ajwNKO/

JS/Vue：

new Vue({
  el: '#app',
  data: {
    selectedFruit: null,
    selectedVariety: null,
    fruits: {
      "apples": [
        {
          name: "honeycrisp",
          madeBy: "applebees",
        },
        {
          name: "macintosh",
          madeBy: "the steves",
        },
        {
          name: "gala",
          madeBy: "ac/dc",
        },
        {
          name: "pink lady",
          madeBy: "Alecia Beth Moore",
        },
      ],
      "pears": [
        {
          name: "d'anjou",
          madeBy: "Maya D'Anjoulou",
        },
        {
          name: "bartlett",
          madeBy: "Anton Yelchin",
        }
      ],
    },
  },
  computed: {
    fruitVarieties: function() {
      return …

我正在将vue-cli中的webpack模板用于我的Vue项目，并且在npm中同时安装了矩和矩时区。

在我的单个文件组件中，通过包含以下导入行，我已经可以时刻使用moment-timezone：

import moment from 'moment'
import moment_timezone from 'moment-timezone'

moment_timezone对象从未使用过，但似乎需要在那里使用，以便moment.tz函数起作用。

我的问题是：

1. 这是在我的设置中加载矩和矩时区的正确方法吗？
2. 如何仅从moment-timezone-with-data-2012-2022.min.js加载数据？我在moment-timezone包的builds目录中看到了它，但是我不清楚如何指定那是我要使用的数据。