Vue.js &引用；“数据未定义”；对于vue jsx组件
我是vue新手，尝试导出/导入组件，但不明白为什么下面的代码不起作用。我正在使用webpack捆绑所有东西，据我所知，它正在成功地完成这项工作。我收到的错误来自浏览器的控制台： 1） [Vue warn]：呈现错误：“ReferenceError:未定义数据” 2） ReferenceError:Proxy.render（menu.js:9）中未定义数据 我不确定这些错误是什么意思，因为在我看来，“数据”是有定义的 如果感兴趣，请参阅以下全部源代码： menu.jsVue.js &引用；“数据未定义”；对于vue jsx组件,vue.js,import,export,vue-component,jsx,Vue.js,Import,Export,Vue Component,Jsx,我是vue新手，尝试导出/导入组件，但不明白为什么下面的代码不起作用。我正在使用webpack捆绑所有东西，据我所知，它正在成功地完成这项工作。我收到的错误来自浏览器的控制台： 1） [Vue warn]：呈现错误：“ReferenceError:未定义数据” 2） ReferenceError:Proxy.render（menu.js:9）中未定义数据 我不确定这些错误是什么意思，因为在我看来，“数据”是有定义的 如果感兴趣，请参阅以下全部源代码： menu.js export default
export default {
data() {
return {
routes: [ '/database-viewer' ]
}
},
render( h ) {
return (
<div class="Menu">{data.routes[0]}</div>
)
}
}
import Vue from 'vue/dist/vue.esm.js'
import Menu from './components/menu.js'
window.onload = function() {
console.log( 'starting program' )
var app = new Vue({
el: '#index',
render: ( h ) => {
return (
<div>
<Menu/>
</div>
)
}
})
}
导出默认值{
数据（）{
返回{
路由：['/数据库查看器']
}
},
渲染（h）{
返回(
{data.routes[0]}
)
}
}
export default Vue.component( 'Menu', {
data() {
return {
routes: [ '/database-viewer' ]
}
},
render( h ) {
return (
<div class="Menu">{data.routes[0]}</div>
)
}
})
导出默认Vue.component（'Menu'{
数据（）{
返回{
路由：['/数据库查看器']
}
},
渲染（h）{
返回(
{data.routes[0]}
)
}
})
export default {
data() {
return {
routes: [ '/database-viewer' ]
}
},
render( h ) {
return (
<div class="Menu">{data.routes[0]}</div>
)
}
}
import Vue from 'vue/dist/vue.esm.js'
import Menu from './components/menu.js'
window.onload = function() {
console.log( 'starting program' )
var app = new Vue({
el: '#index',
render: ( h ) => {
return (
<div>
<Menu/>
</div>
)
}
})
}
从'Vue/dist/Vue.esm.js'导入Vue
从“./components/Menu.js”导入菜单
window.onload=函数（）{
console.log（‘启动程序’）
var app=新的Vue({
el:'索引'，
渲染：（h）=>{
返回(
)
}
})
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div id="index">
</div>
</body>
</html>
我认为问题出在JSX渲染函数中，您应该使用
this.routes[0]data.routes[0]