javascript - 如何从构造函数中使用/导入 App.vue 中的数据

标签 javascript vue.js

我正在使用 main.js 初始化我的应用程序,如下所示,

import App from './App.vue';

const store = {
    items: [{
        todo: 'Clean Apartment.',
    },{
        todo: 'Mow the lawn!',
    },{
        todo: 'Pick up eggs, milk & flour',
    }, {
        todo: 'Watch the big game',
    }],
};

const app = new Vue({
    el: '#app-zone',
    data: store, // is this not sending the store data into App.vue?
    render: h => h(App),
});

我正在尝试在 App.vue 中使用 items。但我不确定它是如何或是否被传递到其中的。

App.vue 看起来像这样...

export default {
    props['items'], // not sure if that's correct
    created() {
        console.log(this.items);  // always returns undefined
    }
}

那么如何从构造函数获取数据并使用它呢?感谢您的帮助!

最佳答案

为了通过 render 函数传递 props,您需要提供一个 context 对象。请参阅https://v2.vuejs.org/v2/guide/render-function.html#createElement-Arguments

render: h => h(App, {
  props: {
    items: store.items
  }
})

关于javascript - 如何从构造函数中使用/导入 App.vue 中的数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42355928/

相关文章:

javascript - Vue.js bulma 模式未显示

javascript - Jquery - 将链接颜色与显示的图像匹配

javascript - Angularjs Skype URI "onclick"问题

javascript - 将 Pastebin 设置为 JavaScript 变量

javascript - 获取与 setTimeout 或 setInterval 关联的函数

vue.js - 从组件实例中获取 Vue 组件对象(类)

webpack - 如何将 jointjs 与 Vue 2 和 webpack 集成

javascript - 使用 Firebase Data Vue.js 动态填充数组

javascript - 在 Angular 单页应用程序引导时创建登录微调器

vue.js - 循环出输入属性?