[新手]vue-cli项目问题
报错如下
报错信息:
文件结构
components->header.vue
<template>
<header class="content clearfix">
<div class="left">
<img :src="logo_src" alt="logo图">
</div>
<div class="right">
<div class="nav-top">
<span class="zh_click" @click="zh_tran('s')" id="zh_click_s">简</span>
</div>
<div class="nav-bt">
<ul class="clearfix father-ul">
<li v-for="item in navs">
<router-link :to="item.href" :class="{current:item.cur}" v-text="item.content"></router-link>
<div class="drop-div" v-if="!!item.child">
<span class="trangle"></span>
<ul class="child-ul">
<li v-for="item_child in item.child">
<router-link :to="item_child.href">{{item_child.content}}</router-link>
</li>
</ul>
</div>
</li>
</ul>
</div>
</div>
</header>
</template>
<script>
export default {
name: 'Header',
data() {
return {
logo_src: '../assets/img/logo.png',
navs: [{
content: '首页',
href: state.page_src.index_src,
cur: true,
child: null
},
{
content: '首页2',
href: state.page_src.company_src,
cur: false,
child: [{
content: '2-1',
href: state.page_src.introduce_src,
}, {
content: '2-2',
href: state.page_src.charge_src,
}]
},
{
content: '首页3',
href: state.page_src.about_src,
cur: false,
child: null
}
]
}
}
}
</script>
<style lang="css">
</style>
pages->index.vue
<template>
<div id="wrap">
<header-menu></header-menu>
</div>
</template>
<script>
import headerMenu from '../components/header'
export default {
data() {
return {
}
},
components: {
headerMenu
}
}
</script>
router->index.js
import Vue from 'vue'
import Router from 'vue-router'
import Index from '../pages/index'
Vue.use(Router)
export default new Router({
routes: [
{
path: '/',
// name: 'HelloWorld',
component: resolve => require(['../pages/index'], resolve),
meta: {
title: 'index'
}
},
{
path: '/index',
component: Index
},
]
})
store->index.js
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
const state = {
page_src: {
index_src: './index',
introduce_src: '/introduce',
about_src: './about',
}
}
export default new Vuex.Store({
state
})
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>test</title>
</head>
<body>
<div id="app">
<router-view></router-view>
</div>
<!-- built files will be auto injected -->
</body>
</html>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
header.vue里面的state没有定义