Wopelo的博客

1.前言之前总结了一篇博客——《Vue响应式的简单模型》，里面介绍了观察者模式和发布订阅模式，并通过自己实现一个轻量级Vue框架的方式介绍了Vue2.0和3.0响应式的简单原理。但在自己实现的轻量级Vue框架中，仍然采用“传统”的Options API的方式。我们知道Vue3.0的一个亮点就是引入了Composition API，这篇博客就简单介绍一下Composition API响应式的原理。和之前《介绍Vue响应式的简单模型》一样，我们先介绍Composition API的核心原理，然后再通过自己

1.前言最近在梳理vue响应式的原理，有一些心得，值得写一篇博客出来看看。其实之前也尝试过了解vue响应式的原理，毕竟现在面试看你用的是vue的话，基本上都会问你几句vue响应式的原理。以往学习这块就是看看别人写的文章，或者翻翻源码。这个过程中发现相当一部分文章看完之后一句话总结就是—— vue通过 Object.defineProperty 或者 Proxy API 拦截了数据的getter/setter，再在getter/setter里面做数据响应的相关逻辑。除此之外就一无所知了。与此同时又发现直接

前言如果我们需要对现有的vue项目进行ssr改造，使用nuxt.js是一个不错的选择。这里用作例子的“现有项目”是一个高仿饿了么外卖APP的spa。不过我没有把全部功能开发出来（全部做出来就不得了了），只是做出几个基本界面意思意思 下面就以这个demo为小白鼠进行ssr改造准备现有目录 很明显，这是使用vue-cli搭建的项目 其中prod.server.js是build...

最近在学习vuex时，照着官网最基本的 Vuex 记数应用示例敲的时候遇到了这样一个问题 想实现的效果： 点击加号、减号实现数字增减 vuex设置：Vue.use(Vuex);Vue.prototype.$store = new Vuex.Store({ state: { count: 0 }, mutations: { in...

前言在vuex中提交 mutation 是更改状态的唯一方法，并且这个过程是同步的，异步逻辑都应该封装到 action 里面。对于mutation/action，有一个常见的操作就是传参，也就是官网上说的“提交载荷”。 这里是关于如何在vue-cli中使用vuex的方法，我们采用将vuex设置分割成不同模块的方法。其中，state模块中配置如下//vuex中的stateconst st...

前言众所周知，vuex 是一个专为 vue.js 应用程序开发的状态管理模式，在构建一个中大型单页应用中使用vuex可以帮助我们更好地在组件外部管理状态。而vue-cli是vue的官方脚手架，它能帮助我们方便的配置webpack。这样看来，有很大的可能我们需要同时使用vue-cli与vuex如何在vue-cli中使用vuex项目搭建及添加vuex 当我们使用vue-cli搭建一个vu...

vue框架推荐使用axios来发送ajax请求，之前我还写过一篇博客来讲解如何在vue组件中使用axios。但之前做着玩用的都是get请求，现在我自己搭博客时使用了post方法，结果发现后台（node.js）完全拿不到前台传来的参数。后来进过一番探索，终于发现问题所在。post提交数据的四种编码方式1.application/x-www-form-urlencoded 这应该是最常见...

vue+webpack使用axios

在使用vue-cli等脚手架初始化项目之后，css-loader和vue-style-loader就默认装好了，如果我们要在vue组件中使用sass应该这么做呢？ 首先需要安装node-sass和sass-loadernpm install node-sass --save-dev --no-optionalnpm install sass-loader --save-dev --no-opti

在使用webpack时（windows环境），如果在git bash here中启动npm run dev，想要停止服务，ctrl+c是不起作用的，这个时候只能通过任务管理器停止进程。如果用windows自带的cmd则可以通过ctrl+c停止服务