如何在Vue.js中访问外部文件中的数据？
如何在Vue.js中访问外部文件中的数据？
提问于 2018-06-06 16:37:34
对Vue.js来说还是个新手，但非常乐意了解它。在我开始使用Axios和Vuex存储之前，我想了解一下如何从一个单独的文件向我的组件发送一些测试数据？希望有人能帮上忙。
如果我在我的组件中这样做，它会工作：
<script>
export default {
data () {
return {
logItems: [
{ log1d: 1, logDetail: 'This is some log detail for log 1', logType: 'general', createdBy: 'name', CreatedAt: 'date' },
{ log1d: 2, logDetail: 'This is some log detail for log 2', logType: 'general', createdBy: 'name2', CreatedAt: 'date2' },
{ log1d: 3, logDetail: 'This is some log detail for log 3', logType: 'general', createdBy: 'name3', CreatedAt: 'date3' },
{ log1d: 4, logDetail: 'This is some log detail for log 4', logType: 'general', createdBy: 'name4', CreatedAt: 'date4' }
]
}
}
}
但我假设我可以从外部文件导入它，如下所示：
import logs from '~/components/testdata.vue'
export default {
data () {
return {
logitems: logs
}
}
}在我的testdate.vue文件中，我有：
<script>
export default {
data () {
return {
// Dummy Test Data
logs: [
{ log1d: 1, logDetail: 'This is some log detail for log 1', logType: 'general', createdBy: 'name', CreatedAt: 'date' },
{ log1d: 2, logDetail: 'This is some log detail for log 2', logType: 'general', createdBy: 'name2', CreatedAt: 'date2' },
{ log1d: 3, logDetail: 'This is some log detail for log 3', logType: 'general', createdBy: 'name3', CreatedAt: 'date3' },
{ log1d: 4, logDetail: 'This is some log detail for log 4', logType: 'general', createdBy: 'name4', CreatedAt: 'date4' }
]
}
return logs
}
}
有人能告诉我我做错了什么吗?为什么把我的数据放到一个单独的文件中不起作用？
非常感谢。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/50715823
复制相关文章
相似问题