随笔分类 - Vue
摘要：pinia持久化插件：https://prazdevs.github.io/pinia-plugin-persistedstate/guide/config.htmlaxios请求：https://www.axios-http.cn/vue-quill编辑器：https://vueup.github
阅读全文
摘要：pinia是一个vue中的插件，功能是一个仓库，用来存放数据。当我们的数据在多个组件中都需要用到的时候，如果一个个向后端获取就会很麻烦。数据获取一次存放在pinia仓库中，用起来就会非常方便还减轻服务器压力。pinia官网：https://pinia.vuejs.org/zh/ ，也可以在vue的生
阅读全文
摘要：今天实现切换歌曲时发现问题，切换歌曲的逻辑就是更改列表索引获取当前播放歌曲，然后播放歌曲。结果更改歌曲成功了，但是无法切换完播放。后来发现问题，歌曲加载需要时间，播放的指令运行时歌曲还未加载好，所以就出现了无法正常播放的问题。vue中的nextTick函数：在下次 DOM 更新循环结束之后执行延迟回
阅读全文
摘要：一、vue3创建项目与介绍 vue3创建项目与vue2使用vue-cli（基于webpack）脚手架不同，vue3使用create-vue（基于vite，更快）。创建项目的指令如下，首先看一下node的版本（node -v），16以上才支持。第一次创建项目会去下载create-vue比较慢（下载是下
阅读全文
摘要：一、自定义创建项目 默认的项目有很多包不全，需要的时候还要导包搭架子，因此我们可以自定义创建项目。 选择的项目按照自己需要的设置，可参考如下参数设置。（eslink是一种代码规范） 首先cd进入项目需要存放的位置，再用下面的命令创建项目。 vue create 项目名 二、vuex 1、vuex概述
阅读全文
摘要：一、路由的封装抽离 目标：将路由模块抽离出来。好处：拆分模块，易于维护。 第一步：在src目录下新建一个router目录，在创建一个index.js文件，将先前main.js中的路由代码转移到index.js文件中。（这里需要使用到vue所以需将vue包导入；需修改组件路径，@符号代表绝对路径src
阅读全文
摘要：一、自定义指令 自定义指令:自己定义的指令,可以封装一些dom操作，扩展额外功能 全局注册语法 Vue.directive('指令名',{ "inserted" (el){ //可以对el标签，扩展额外功能 } }) View Code 局部注册语法 directives:{ "指令名":{ "in
阅读全文
摘要：一、组件的三大组成部分 <template> 里面只能有一个根元素 <style> 全局样式(默认):影响所有组件局部样式: scoped 下样式，只作用于当前组件 <script> el根实例独有, data是一个函数,其他配置项一致 二、scoped设置局部样式 默认情况:写在组件中的样式会全局
阅读全文
摘要：一、Vue生命周期 Vue生命周期就是一个Vue实例从创建到销毁的过程 生命周期四个阶段：1、创建 2、挂载 3、更新 4、销毁 Vue生命周期函数（钩子函数） Vue生命周期过程中，会自动运行一些函数,被称为[生命周期钩子]→让开发者可以在[特定阶段]运行自己的代码。 创建阶段其实就是开辟存放数据
阅读全文
摘要：一、指令修饰符 通过"."指明一些指令后缀，不同后缀封装了不同的处理操作 → 简化代码①按键修饰符@keyup.enter → 键盘回车监听②v-model修饰符v-model.trim →去除首尾空格v-model.number →转数字③事件修饰符@事件名.stop →阻止冒泡@事件名.prev
阅读全文
摘要：Vue是一个构建用户界面的渐进式框架。官网：https://cn.vuejs.org/。 Vue可以用网上的CDN，也可以下载到本地（下载的话就是进入官网打开学习文档，点击基础里面的安装，点击里面的开发版本这几个字，建议下载开发版本，里面包含完整的警告和调试模式） 1、创建Vue2实例 首先将下载的
阅读全文