Javascript Vue.js中的嵌套属性类型

有没有办法跟踪Vue上的嵌套属性类型

我有这个道具设置：

// ...
props: {
    navigation: {
        type: [Array],
        default: () => {
            return [
                { type: String, icon: "home" },
                { type: String, icon: "star" }
            ]
        }
    }
}

---

现在我只对第一级数组进行了验证，但数组内部什么都没有发生。我可以检查其中一个类型级别内的类型吗？Thx寻求帮助。

我认为不可能使用

type

属性直接键入对象数组，如下所示：

类型可以是以下本机构造函数之一：


串
数
布尔值
作用
反对
排列
象征

话虽如此，您似乎可以定义如下验证程序函数：

props: {
    navigation: {
        validator: function (value) {
            if (!(value instanceof Array)) {
                return false;
            }
            for(var i = 0; i < value.length; ++i) {
                if (typeof value.icon !== "string") {
                    return false;
                }
            }
            return true;
        },
        default: () => {
            return [
                {icon: "home" },
                {icon: "star" }
            ]
        }
    }
}

道具：{
导航：{
验证器：函数（值）{
if（！（数组的值实例））{
返回false；
}
对于（变量i=0；i{
返回[
{图标：“主页”}，
{图标：“星”}
]
}
}
}
我认为不可能使用
type
属性直接键入对象数组，如下所示：

类型可以是以下本机构造函数之一：


串
数
布尔值
作用
反对
排列
象征

话虽如此，您似乎可以定义如下验证程序函数：

props: {
    navigation: {
        validator: function (value) {
            if (!(value instanceof Array)) {
                return false;
            }
            for(var i = 0; i < value.length; ++i) {
                if (typeof value.icon !== "string") {
                    return false;
                }
            }
            return true;
        },
        default: () => {
            return [
                {icon: "home" },
                {icon: "star" }
            ]
        }
    }
}

道具：{
导航：{
验证器：函数（值）{
if（！（数组的值实例））{
返回false；
}
对于（变量i=0；i{
返回[
{图标：“主页”}，
{图标：“星”}
]
}
}
}
除了typescript和类库之外，我发现
\每一个
和
\都可以成为验证复杂道具的可读解决方案


从“lodash/every”导入每个
从“lodash/has”导入has
导出默认值{
名称：'导航'，
道具：{
项目：{
类型：数组，
验证程序：项=>
每（项，（项）=>
有（项目“主页”）&&
有（项目“星型”）
)
}
}
}
除了typescript和类库之外，我发现
\每一个
和
\都可以成为验证复杂道具的可读解决方案


从“lodash/every”导入每个
从“lodash/has”导入has
导出默认值{
名称：'导航'，
道具：{
项目：{
类型：数组，
验证程序：项=>
每（项，（项）=>
有（项目“主页”）&&
有（项目“星型”）
)
}
}
}
使这项工作变得容易。在以下示例中，请注意字符串数组：

    props: {

        picNum: VueTypes.number.def( 3 ),
        pics: VueTypes.arrayOf( String ).isRequired, // RIGHT HERE!
        step: VueTypes.number.def( 1 ),
        className: VueTypes.string.def( '' ),

    },

另外，vue类型还有更多用于定义对象形状等的辅助工具。与vue道具一起使用非常好
 使这件事变得容易。在以下示例中，请注意字符串数组：

    props: {

        picNum: VueTypes.number.def( 3 ),
        pics: VueTypes.arrayOf( String ).isRequired, // RIGHT HERE!
        step: VueTypes.number.def( 1 ),
        className: VueTypes.string.def( '' ),

    },

另外，vue类型还有更多用于定义对象形状等的辅助工具。与vue道具一起使用非常好
 “跟踪嵌套属性类型”是什么意思？你的意思是，当你不遵守这些类型时，能够为它们分配类型并让编译器警告你吗？是的，没错，你指的是来自
default
函数的返回类型吗？是的，但是下一级，即这个图标字符串的返回类型是什么？你希望
导航
是什么？您目前已经说过它的类型应该是数组，但是您定义的默认函数返回一个对象数组（带有键类型和图标）。注意：从您发布的文档中的示例来看，您似乎没有从默认函数中键入返回值。您所说的“跟踪嵌套属性类型”是什么意思？你的意思是，当你不遵守这些类型时，能够为它们分配类型并让编译器警告你吗？是的，没错，你指的是来自
default
函数的返回类型吗？是的，但是下一级，即这个图标字符串的返回类型是什么？你希望
导航
是什么？您目前已经说过它的类型应该是数组，但是您定义的默认函数返回一个对象数组（带有键类型和图标）。注意：从您发布的文档中的示例来看，您似乎没有从默认函数中键入返回值。很好，但我没有使用typescript，我只想使用Vue it self和提供的功能来执行此操作-误解啊，好的，您应该从问题中删除typescript标记。你的问题是什么？Vue.js是否使用
type:
属性支持自己的类型系统？你能指出提到这一点的文档吗？呵呵，这个验证器是如此的核心，想象一下我必须为每个数据类型和每个组件定义它：）但是谢谢你的尝试，干杯，祝你好运，现在我非常确定我会安装typescript:DGreat，但我没有使用typescript，我只想使用Vue-it-self来实现这一点，和交付的功能-误解啊，好的，那么你应该从你的问题中删除typescript标签。你的问题是什么？Vue.js是否使用
type:
属性支持自己的类型系统？你能指出提到这一点的文档吗？呵呵，这个验证器是如此的核心，想象一下，我必须为每个数据类型和每个组件定义它：）但是谢谢你的尝试，干杯，祝你好运，现在我非常确定我将安装typescript:D