vue mint-ui 使用及其错误解决

Use

 npm install -g vue-cli  vue init webpack projectname

测试时：

npm run dev

打包时：

npm run build

vue-router

1、配置 Router
用 vue-cli 创建的初始模板里面，并没有 vue-router，需要通过 cnpm 安装

cnpm i vue-router -D

2、在 router.js 中引入所需的组件，创建 routers 对象

import Vue from 'vue' import Router from 'vue-router' import StartPage from '@/components/StartPage' import Index from '@/components/Index'  Vue.use(Router)  export default new Router({   routes: [     {       path: '/',       name: 'StartPage',       component: StartPage     },     {       path: '/index',       name: 'Index',       component: Index     }   ] })

3、路由使用

使用映射路由

 <router-link to="/index"></router-link>

编程式导航

// 字符串 this.$router.push('/home/first')  // 对象 this.$router.push({ path: '/home/first' })  // 命名的路由 this.$router.push({ name: 'home', params: { userId: wise }})

Notice

1 . 加上scoped说明该css只在该组件中生效。

<style scoped> ... <style>

2 . vue项目打包之后图片等其他资源路径错误

解决方法：找到项目中的config包中的index.js文件

     assetsPublicPath: '/',       修改为      assetsPublicPath: './',

3 . vue项目控制台报出警告（关闭ESlint 语法验证）

解决方法：找到项目中的config包中的index.js文件

     useEslint: true,      修改为      useEslint: false,

问题描述：

文章来源: vue mint-ui 使用及其错误解决

标签

vue

vue-router