将Vue道具的默认设置为父母的选项

Question

我有一个子组件，需要接受其父对象$options对象中提供的值作为可能的默认值。

背景：该组件应能够通过道具或从配置中获取其数据。但是有些遗留代码依赖于作为选项传递给主Vue实例的数据。

创建Vue实例的新方法是：

new Vue({
    el: '#app',
    render: h => h(MainComp, { 
        props: {
            document: 'data.json'
        }
    })
});

如果未提供属性（或将其设置为最终默认值null），则组件负责从配置文件中获取属性值：

import Config from './config.js';
[...]    
props: {
    document: {
        default: Config.document || null
    },

效果很好。

但是，在旧版代码中，实例是这样创建的：

new Vue({
    el: '#app',
    document: 'data.json',
    render: h => h(MainComp)
});

，并且通过调用data()在this.$parent.$options['document']函数中传递数据。

我的第一个想法是将相同的代码添加到新的default中：

default: this.$parent.$options['document'] || Config.document || null

但显然不起作用，因为as the docs say“在创建组件实例之前验证了道具，因此[实例属性] [不可用]”。

因此，我尝试通过data()函数来指定“特殊默认设置”，如下所示：

data() {
    return {
        document: document || this.$parent.$options['document']
    };
},

但是随后，Vue正确地抱怨：“数据属性“ document”已经声明为prop。请改用prop默认值。“

我如何解决这个恶性循环？

Answer 1

这可能有效：

default: () => this.$parent.$options['document'] || Config.document || null