卡卡西：一个擅长拷贝的前端程序员

class EventBus { constructor() { this.events = this.events || {}; //{key:Array} } /** * @param {String} eventName * @param {Function} callback */ $on(eventName, callback) { if (thi

问题描述：报错：Props with type Object/Array must use a factory function to return the default value.使用 prop 进行父子组件传值时，设置了默认值(如下)，导致报上边的错props: { actData: { type: Object, default: {}, },},报错原因翻译报错信息：props default 数组／对象的默认值应当由一个工厂函数返回解决

由于使用单一状态树，应用的所有状态会集中到一个比较大的对象。当应用变得非常复杂时，store 对象就有可能变得相当臃肿。为了解决以上问题，Vuex 允许我们将 store 分割成模块（module）。每个模块拥有自己的 state、mutation、action、getter、甚至是嵌套子模块——从上至下进行同样方式的分割：const moduleA = { state: () => ({ ... }), mutations: { ... }, actions: { ... },

和Vue2.0 相比，Vue3.0有哪些亮点：序号特性解析1Performance性能上比Vue2.0快1.3-2倍2Tree shaking support按需编译，体积更加轻量化3Composition API组合API，类似 ReactHooks4Better TypeScript support对 Ts 提供了更好的支持5Custom Renderer API暴露了自定义渲染API6Fragment,Teleport(Pro

1.处理组件配置项2.初始化组件实例的关系属性，比如 $parent、$children、$root、$refs 等3.处理自定义事件4.调用 beforeCreate 钩子函数5.初始化组件的 inject 配置项，得到 ret[key] = val 形式的配置对象，然后对该配置对象进行响应式处理，并代理每个 key 到 vm 实例上6.数据响应式，处理 props、methods、data、computed、watch 等选项7.解析组件配置项上的 provide 对象，将其挂载到 vm._provid

vue项目使用swiper轮播，后边的轮播组件点击不起作用

通过vue create 创建的项目，运行期间报错： “TypeError: Cannot set property ‘VUE_DEVTOOLS_UID’ of null”版本信息：@vue/cli 4.5.9截图：问题原因因为我的chrome 安装了 vue-devtools工具解决方案在 src/main.js 中设置： Vue.config.devtools = false; 但这样vue-devtools就不能用啦。更新下 vue-devtools 工具的版本就好vue-

更多详细内容可查阅 VueRouter官方文档1.在组件内可通过 this.$router 访问整个 路由器，也可以通过 this.$route 访问 当前路由// Home.vueexport default { computed: { username() { // this.$route 访问当前路由 return this.$route.params.username } }, methods: { goBack() {

自从官方停止维护vue resource之后，axios成为了大家与后端交互获取数据的最佳选择，做为vue官方推荐的http库，它有很多优秀特性，并且给开发者提供了很多二次开发的可能，关于更多，大家可以去查一下官方文档。接下来我们说说项目中对axios常做的封装拦截：安装axiosnpm install axios引入axios封装的axios一般是在项目的 src 目录下边新建 request文件夹，新建一个request.js文件，内容如下：// 引入axiosimpor.

vuex是什么？“Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。” -----援引自vuex官网一、安装npm install vuex --save二、核心概念state：单一状态树，用一个对象就包含了全部的应用层级状态。Mutation：更改 Vuex 的 store 中的状态的唯一方法是提交 mutation。Vuex 中的 mutation 非常类似于事件：...

今天遇到个问题，是 IOS 用户base64解码失败。问题描述：用户淘宝授权，淘宝给的授权信息经后端 base64 加密之后拼在url中返回给前端，前端通过url取值，然后base64解码获取数据，进而绑定商品。但是有且仅有一个用户，账号一直绑定不上，其他用户均没问题。前端为VUE，部分代码如下：import { Base64 } from 'js-base64';...created() { const code = this.$route.query.code..

从这里开始，记录VUE源码分析。1. 将 vue 源码拉到本地，方便分析vue 源码地址来自 全球最大同性交流网站-- gitHub：https://github.com/vuejs/vue我们将 dev 分支代码克隆到本地cd 到本地存放目录：cd 你的本地存放目录git clone 将代码clone下来git clone https://github.com/vuejs/vue.git ⚠️ 如果想直接在github查看，可安装一个插件Octotree ，可在..

大家都知道，Vue2.0 实现数据响应式主要是依赖Object.defineproperty 这个API，可实际上defineproperty 不能监听数组变化，可是我们在vue中操作数组数据的时候，也能实现响应式更新，这是为什么呢？翻开 VUE 源码 中的src/core/observer/array.js 文件，我们能看到，因为vue 的开发者对数组改变数据的 7 个方法做了一些改动：...const arrayProto = Array.prototypeexport ...

文章摘自Vue Router官网一、全局守卫1.全局前置守卫：router.beforeEachconst router = new VueRouter({ ... })router.beforeEach((to, from, next) => { // ...})每个守卫方法接收三个参数：to: Route: 即将要进入的目标路由对象 from: Route: 当前导航正要离开的路由 next: Function: 一定要调用该方法来re...

1.项目目录结构 vue-cli2.0与3.0在目录结构方面，有明显的不同vue-cli3.0移除了配置文件目录，config和build文件夹同时移除了static静态文件夹，新增了public文件夹，打开层级目录还会发现，index.html移动到public中2.配置项 3.0 config文件已经被移除，但是多了.env.production和env.development文件，除了文件位置，实际配置起来和2.0没什么不同没了config文件，跨域需要配...

第一种前端将公共部分的路由直接写在前端代码中，其余部分前端开发完成后，将对应路由复制一份给后端根据权限匹配存储在数据库中，用户登录时，从后端数据库中根据用户权限读取对应路由返回给前端，再添加到前端路由中动态渲染上。这样操作，需要前后端密切配合，而且页面中的操作级权限不能控制；第二种在路由的meta属性中增加 roles字段，用来存储可访问当前路由的权限，在路由全局守卫router.beforeEach中进行拦截处理，示例如下：路由信息routes: [ {

实际得到的数据不能直接放到页面中展示，而是需要进行一些操作处理，就使用computed。watch 适用场景：一个数据影响多个数据； computed适用场景：一个数据受多个数据影响；两者区别：computed不支持异步操作，而watch支持计算属性computed：支持缓存，只有依赖数据发生改变，才会重新进行计算； 不支持异步，当computed内有异步操作时无效，无法监听数据的变化； computed属性值会默认走缓存，计算属性是基于它们的响应式依赖进行缓存的，也就是基于data

1. props/$emit 父子组件通信子组件通过 props接收父级传递的参数，通过$emit触发父级方法，传递参数子组件：<input type="text" :value="title"><button @click="addList">添加</button>...props: ['title'],...addList () { this.$emit('add', this.title);...}父组件：<In

效果如下，数据都是接口返回的，思路：element-ui 的单选<el-radio>标签，可通过 v-model 绑定变量来设置默认值，但上图这种效果，所有数据都是接口动态返回，不能预先在data中定义 每组单选 变量来设置默认值，可在data中定义一个数组 qualitySelect，数据返回时，有几组数据向这个数组中push几个值，值为每组数据默认的选中值，注意，值必须为number类型，才会给<el-radio>的v-model赋值上<tabl...

详见vue-router官网1.router-link1.1 不传参<router-link :to="/home">跳转</router-link>1.2 传参<router-link :to="{name:'home', params: {id:1}}"></router-link>params传参数 (类似post) 路由配置 path: "/home/:id" 或者 path: "/home:id" ...

最近做审核平台，涉及到多人分配审核数据，就需要定时自动刷新数据防止多人重复审核，其实就是页面加一个定时器，固定时间请求接口刷新数据，先回想下vue的生命周期在 mounted 周期时，页面结构已经生成，可以进行数据请求，所以我把定时器定义在了这里mounted(){ if (this.timer) { clearInterval(this.timer); } else { this.timer = setInterval(() => {

这两天遇到个需求，一个数据列表，单条数据左滑动出现编辑、删除按钮，右滑动重新隐藏，点击时先判断是否显示删除按钮，显示的话先隐藏，附效果图如下：思路：操作盒子（编辑+删除）定位到列表盒子的最右边；监听touch事件，根据开始和结束时X坐标的变化判断是左滑动还是右滑动；通过给列表盒子动态绑定class（通过transform设置位置变化，显露出操作盒子）；view： ...

每次新建.vue文件，可以利用VSCode的snippet在.vue文件创建后能轻松地生成一套模板，（偷懒促进技术发展，促进社会进步。。。。能用模板一键生成，绝对不去多敲一行代码，哈哈哈。。。）步骤如下Ctrl + Shift + P打开控制台，输入snippets(首选项：配置用户代码片段）； 接下来输入vue并选择，VSCode会自动生成一个vue.json的文件。这里就是我们要...

1、active-class是哪个组件的属性？嵌套路由怎么定义？答：vue-router模块的router-link组件。2、怎么定义vue-router的动态路由？怎么获取传过来的动态参数？答：在router目录下的index.js文件中，对path属性加上/:id。 使用router对象的params.id3、vue-router有哪几种导航钩子？ 答：三种，一...

首先，还是先来演示地址：http://redatao.coding.me/shopping-Cart/；（注：想托管你的项目，让你的小伙伴也能直接通过连接欣赏你的操作，请参考：https://blog.youkuaiyun.com/RedaTao/article/details/68483378）下边是效果展示图：购物车信息：选配地址信息：  开发准备1.开发工具：...