VueJS:如何在我的模板中使用来自 main.js 的数据?

Posted

技术标签:

【中文标题】VueJS:如何在我的模板中使用来自 main.js 的数据?【英文标题】:VueJS: How do I use data from main.js in my templates? 【发布时间】:2017-06-20 11:33:21 【问题描述】:

我的 main.js 中有我的 Vue 范围:

new Vue(
  el: '#app',
  router,
  template: '<App/>',
  components:  App ,
  data: 
    name: 'Levi'
  
)

我想在我的模板中使用它:test.vue:

&lt;p&gt;My name is name

我将 vue-router 用于所有路由功能,一切正常。但是当我尝试在我的模板中调用 name 时,我得到了

[Vue warn]: Property or method "name" is not defined on the instance but referenced during render. Make sure to declare reactive data properties in the data option.

任何帮助将不胜感激。谢谢。

【问题讨论】:

能否为您的问题创建一个jsfiddle,可以开始here。 @mplungjan 在发布之前,我确实已经浏览了所有第 1 页的帖子,但我决定回去,我想我看了一眼底部附近的东西。只需将export default 替换为module.exports 【参考方案1】:

只需要在我的模板中添加一个脚本标签并使用module.exports 而不是export default

【讨论】:

请随意删除该问题,除非您发现它对未来的访问者有用

以上是关于VueJS:如何在我的模板中使用来自 main.js 的数据?的主要内容,如果未能解决你的问题,请参考以下文章

如何使用模板语法访问 vuejs 中的父数据值

使用 webpack 在 vuejs 中分离模板

VueJS:如何在组件数据属性中引用 this.$store

Vue Js如何在单个文件模板中使用mixins?

如何在 VueJS 中下载本地存储的文件

使用从输入 vueJS 更改的模型更新模板