Vue配置

2022/4/11 23:18:20

本文主要是介绍Vue配置,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

1 routes.js配置

 

import Home from '../components/Home.vue'
import Login from '../components/Login.vue'
import Header from '../components/Header.vue'
import Menu from '../components/Menu.vue'
import VueRouter from 'vue-router'
import About from '../components/About.vue'
import Register from '../components/Register.vue'
import Manage from '../components/Manage.vue'
import AddPizza from '../components/Manage/AddPizza'
import ShowPizza from '../components/Manage/ShowPizza'

const routes = [
    { path: '/', component: Home },
    { path: '/login', component: Login },
    { path: '/menu', component: Menu },
    { path: '/about', component: About },
    { path: '/register', component: Register },
    {
        path: '/manage', component: Manage,
        children: [{ path: '/addpizza', component: AddPizza },
        { path: '/', component: ShowPizza },]
    },
]


const rs = new VueRouter({
    routes: routes,
    mode: 'history'
})

export default rs

 

 

 

2 store.js 配置

 

import Vue from 'vue';
import Vuex from 'vuex'

Vue.use(Vuex)

export const store = new Vuex.Store({
    state: {
        
    },
    getters: {

    },
    mutations: {
       
    }
});

 

 

3 main.js配置

import Vue from 'vue'
import App from './App.vue'
import VueRouter from 'vue-router' 
import router from './router/r.js'      //改位置
import axios from 'axios'
import { store } from './store/store'   //改位置

Vue.prototype.$axios = axios

Vue.use(VueRouter)
Vue.config.productionTip = false

new Vue({
  render: h => h(App),
  router: router,
  store: store
}).$mount('#app')

 



这篇关于Vue配置的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!


扫一扫关注最新编程教程