typescript 错误信息。“对象/数组类型的道具必须使用工厂函数来返回默认值。”
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/51958950/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Error message. "Props with type Object/Array must use a factory function to return the default value."
提问by Kuru
I am using Vue-Cli3.0. I used this module for Vue.js. https://github.com/holiber/sl-vue-tree
我正在使用 Vue-Cli3.0。我在 Vue.js 中使用了这个模块。https://github.com/holiber/sl-vue-tree
This is a customizable draggable tree component for Vue.js but I found that it could not copy functions of object.
这是一个可自定义的 Vue.js 可拖动树组件，但我发现它无法复制对象的功能。
https://github.com/holiber/sl-vue-tree/blob/master/src/sl-vue-tree.js#L715
https://github.com/holiber/sl-vue-tree/blob/master/src/sl-vue-tree.js#L715
Because of here.
因为这里。
JSON.parse(JSON.stringify(entity))
So I used this module and edited the copy function.
所以我使用了这个模块并编辑了复制功能。
https://www.npmjs.com/package/clone
https://www.npmjs.com/package/clone
var clone = require('clone');
copy(entity) {
return clone(entity)
},
In this way, the function of the object is correctly copied.
这样，对象的功能就被正确复制了。
I already have tested it, and it worked correctly. There was no problem with the performance but I got a console error.
我已经测试过了，它工作正常。性能没有问题，但出现控制台错误。
[Vue warn]: Invalid default value for prop "multiselectKey": Props with type Object/Array must use a factory function to return the default value.
found in
---> <SlVueTree>
I want to know the way to erase this error. Thank you for reading my question.
我想知道消除这个错误的方法。感谢您阅读我的问题。
回答by Katinka Hesselink
A factory function in props looks like this:
props 中的工厂函数如下所示：
props: {
exampleDefaultObject: {
type: Object,
default() {
return {}
}
},
exampleDefaultArray: {
type: Array,
default() {
return []
}
}
},
or in ES6:
或在 ES6 中：
props: {
exampleDefaultObject: {
type: Object,
default: () => ({})
},
exampleDefaultArray: {
type: Array,
default: () => []
}
},
(for people who come here looking for an explanation of the error in the question 'props with type object/array must use a factory function to return the default value')
（对于来这里寻找问题“类型为对象/数组的道具必须使用工厂函数来返回默认值”中的错误的解释的人）
Note that when returning an object in an es6 arrow function, you need the parentheses: () => ({})instead of () => {}
请注意，在 es6 箭头函数中返回对象时，需要括号：() => ({})而不是() => {}
回答by Trick
according to your console warn, i find the error
根据您的控制台警告，我发现了错误
https://github.com/holiber/sl-vue-tree/blob/master/src/sl-vue-tree.js#L30
https://github.com/holiber/sl-vue-tree/blob/master/src/sl-vue-tree.js#L30
try to fix it like this:
尝试像这样修复它：
multiselectKey: {
type: [String, Array],
default: function () {
return ['ctrlKey', 'metaKey']
},
validator: function (value) {
let allowedKeys = ['ctrlKey', 'metaKey', 'altKey'];
let multiselectKeys = Array.isArray(value) ? value : [value];
multiselectKeys = multiselectKeys.filter(keyName => allowedKeys.indexOf(keyName ) !== -1);
return !!multiselectKeys.length;
}
},
the component default value must use a factory function to return!
组件默认值必须使用工厂函数返回！
try it and hope it can help you
试试看，希望它可以帮助你
