在 Vue.js 中將 props 傳遞給根實例

Question

問題

我正在嘗試將道具傳遞給我的根構造函數。 我知道propsData 是要走的路：

var appComponent = Vue.component('app', require('./components/app/app.vue.html'));
new Vue({
    el: '#app-root',
    router: new VueRouter({ mode: 'history', routes: routes }),
    propsData: { test: 'hi!' },
    components: { appComponent },
    render: h => h('app')
}); 

這是接收道具的AppComponent ：

export default class AppComponent extends Vue {

    @Prop()
    test: string;

    mounted() {
        console.log('test = ' + this.test);
        // result: test = undefined
        // expected: test = 'hi!'
    }
}

---

我嘗試過的事情

使其在開發（而不是生產）中工作的唯一方法是：

test: string;

beforeCreate() {
    this.test = this.$root.test;
}

它適用於開發（windows），但在部署（linux）中我得到了這個打字稿錯誤：

ERROR in [at-loader] ClientApp/components/app/app.ts:14:34
    TS2339: Property 'test' does not exist on type 'Vue'.

這是另一篇談論這個的帖子。

Answer 1

您可以在data對象中傳遞props ，這是createElement別名h函數在render選項中采用的第二個參數

render: h => h('app', { props: { test: 'hi!' }})