javascript - Meteor AutoForm 中的条件(类别/子类别)选项

Question

我目前正在使用 autoform 和 collection2 来生成表单。我想创建一个更改子类别选项的选择选项。

例如。选择(类别)- 水果- 蔬菜

例如。选择(出现子类别)

如果选择水果:

• 苹果
• 香蕉

如果选择蔬菜:

• 胡萝卜
• 西兰花

我一直在寻找解决方案，但找不到有效的解决方案。有人可以指出我正确的方向吗，因为我不知道从哪里开始。

Answer 1

您可以使用 AutoForm.getFieldValue(fieldName, [formId]) 检索category 的当前值。然后，您可以set the subcategory options取决于是否选择了水果或蔬菜。

例如:

var fruitArr = ['apple', 'banana'];
var vegetablesArr = ['carrot', 'broccoli'];

Food = new Mongo.Collection("food");

Food.attachSchema(new SimpleSchema({
    category: {
        type: String,
        label: "Category",
        allowedValues: ['fruit', 'vegetables']
    },
    subcategory: {
        type: String,
        label: "Subcategory",
        allowedValues: _.union(fruitArr, vegetablesArr),
        autoform: {
            options: function () {
                let category = AutoForm.getFieldValue("category");
                if (!category) return [{label: "Please select a category first", value: ""}];
                if (category === "fruit") return _.map(fruitArr, (v, i) => ({
                    label: "Fruit " + (i + 1) + ": " + v,
                    value: v
                }));
                else return _.map(vegetablesArr, (v, i) => ({label: "Vegetables " + (i + 1) + ": " + v, value: v}));
            }
        }
    }
}));