[学习笔记] vue2学习问题总结

依赖版本号:

"vue": "^2.3.3",
"vue-resource": "^1.3.4",
"vue-router": "^2.6.0",
"vuex": "^2.3.1"

---1. Uncaught TypeError: Cannot read property '_c' of undefined

报错原因: 路由配置 routes:[{component: }],不是components
参考地址

---2. Uncaught TypeError: VueRouter is not a constructor

报错原因: 引入vu-router后别别忘记在使用前new一下.
import VueRouter from 'vue-router' Vue.use(VueRouter);
参考地址

---3. This dependency was not found:* !!vue-style-loader!css-loader?{"minimize":false,"sourceMap":false}!../../node_modules/vue-loader/lib/style-compiler/index?{"vue":true,"id":"data-v-42031a26","scope
d":false,"hasInlineConfig":false}!less-loader?{"sourceMap":false}!../../node_modules/vue-loader/lib/selector?type=styles&index=0!./home.vue in ./src/views/home.vue
To install it, you can run: npm install --save !!vue-style-loader!css-loader?{"minimize":false,"sourceMap":false}!../../node_modules/vue-loader/lib/style-compiler/in
dex?{"vue":true,"id":"data-v-42031a26","scoped":false,"hasInlineConfig":false}!less-loader?{"sourceMap":false}!../../node_modules/vue-loader/lib/selector?type=styles
&index=0!./home.vue

报错原因: 我项目中使用了less, 却没安装相应的依赖,安装less和less-loader即可
参考地址

---4. Uncaught TypeError: Right-hand side of 'instanceof' is not an object
报错原因: props: { swipeid: { type: String, default: "" }}中type类型写错, 写成了'String'
参考地址

---5. vscode使用v-for时候出现讨厌的红色波浪线错误提醒

报错原因: Vue 2.2 之后，要求 component 进行列表渲染时，必须指定 key，因此这里可能是 vscode 的一个误报，如果不想看到这样的提示，你可以绑定一个 key<div v-for="(word,index) in list" :key="index"></div>
针对这样“之前...，现在突然...”的情况，可以先检查一下自己有没有做过升级，然后再去看看相关内容升级之后有些什么变化。
参考地址

---6. import Vue from 'vue' 和 var Vue = require('vue')写法的区别

commonjs 的 require 是加载时执行, 而 es6 的 import 是调用时执行. require 支持动态加载，如 require('./' + module) ; 而import 由于要做静态分析，不支持动态加载
参考地址

---7. npm ERR! code EINTEGRITY npm ERR! sha1-j6jPBBGhoxr9B7BtKQK7n8gVoTM= integrity checksum failed when using sha1: wanted sha1 -j6jPBBGhoxr9B7BtKQK7n8gVoTM= but got sha1-+m12cutSrrqacA3ktZxpF9owLZI=. (204362 bytes)

搜索了很多解决方法, 最后都没能解决掉. 个人估计跟网速有关(这周公司网罢工了!), 用cnpm安装,妥妥滴成功.

---8. 引入文件路径中的@是什么意思, 如:import Hello from '@/components/Hello'

看webpack配置build文件夹里的webpack.base.conf.js里面的resolve里面的alias, 代表绝对路径
参考地址1
参考地址2

---9. vuejs路由使用的问题Error in render function: "TypeError: Cannot read property 'matched' of undefined"

const router = new VueRouter({
  routes // （缩写）相当于 routes: routes, 如果你引入的路由名称是routes1,则必须写成routes: routes1
})
const app = new Vue({
  router //(缩写) 相当于 router: router,  如果你VueRouter实例化名字是router1,则必须写成 router: router1
}).$mount('#app')

直接看参考地址吧,写的很详细
参考地址

---10. pakage.json文件中devDependencies 与 depdencides的区别

devDependencies里面的插件只用于开发环境, 而 dependencies是需要发布到生产环境的

---11.vue.js methods中A方法如何调用B方法

methods: {
    A: function() {
        this.B();
    },
    B: function() {
    }
}
//A方法和B方法都会作为属性加到this中去，所以要注意data中的命名不能和methods中冲突

参考地址

---12. - <template> cannot be keyed. Place the key on real elements instead.

<template>里面不可以使用 :key="xxx", 错误范例: <template v-for="(item, index) in $router.options.routes" :key="index" v-if="!item.hidden">