![](https://img-blog.csdnimg.cn/298ecca778d641629af38912874ea425.jpg?x-oss-process=image/resize,m_fixed,h_224,w_224)
Vue.js
文章平均质量分 78
Vue2.0+Vue3.0学习笔记,如果笔记中有不对的地方,希望各位前端的友友们在评论区指正哦~
凌空暗羽
Bug is the best teacher.
展开
-
vite+element-plus项目基础搭建
vite+element-plus项目基础搭建1.引言2.为什么是Vite?3.为什么是Element-plus?4.项目搭建3.参考文献1.引言 其实本来不应该写这种CSDN比较多的博文的,主要是因为比较多,然后想解决问题的时候有很多各种各样的文章,然后这些文章有各自的解决思路,甚至拿过来又不能解决问题,本着分享和方便以后使用的目的,记录这次使用过程。2.为什么是Vite? 其实我最开始用的是vue-cli,但是使用的时候发现这个每次运行的时候都需要打包,导致运行的比较慢,得等个10几原创 2022-04-16 13:26:14 · 5795 阅读 · 3 评论 -
pinia简介和setup语法糖
pinia简介和setup语法糖1.pinia的基本特点 pinia同样是一个Vue 状态管理工具,它和vuex有很多相似的地方。本质上他是vuex团队核心成员开发的,在vuex上面提出了一些改进。与vuex相比,pinia去除了vuex中对于同步函数Mutations和异步函数Actions的区分。直接在Actions中便能够使用同步和异步方法(在vuex的开发计划中也将会除去同步和异步的区分)。其次相比于vuex,pinia对于typescript的支持性更好,友好的devTools支持,pin原创 2021-11-07 01:53:21 · 4515 阅读 · 0 评论 -
vite组件自定义目录写法
vite组件自定义目录写法我们可能见过这样的写法:import { useLocaleStoreWithOut } from '/@/store/modules/locale';//有过uni-app基础的应该对于这个写法并不陌生,应为在easycom组件动态导入中其实出现过。本质其//实是webpack中支持的一种写法。但是最近看代码的时候遇到了这个:import type { LocaleType } from '/#/config';当时看的我是一愣一愣的,查了一下不是正则写法正则中原创 2021-11-04 00:52:33 · 1225 阅读 · 4 评论 -
Vue-i18n框架学习总结
Vue框架——Vue-i18n学习总结1.概述 Vue I18n 是 Vue.js 的国际化插件,格局比较大,具体怎么解释还是不太好说,直接看用法就能明白。简单说一下为什么叫这个名字:internationalization(i+中间的18个字母+n)。2.配置方法(1)安装vue-I18n插件//需要使用npm进行安装npm install vue-i18n(2)项目中配置使用import Vue from 'vue'import VueI18n from 'vue-i18n'//原创 2021-11-04 00:07:15 · 349 阅读 · 0 评论 -
Vuex学习总结
Vuex学习总结1.概述说说我的理解(不一定对),由于前端的组件化开发常常难免涉及到组件之间的通信。对于一个小型项目来说,通过父子组件通信就够用了。但是,可能随着项目扩大,存在兄弟组件或者祖孙组件通信的通信。其解决方法通常有两种:中央bug机制和间接调用上一级组件(或者上上级组件)。额,难免有些复杂。于是,vuex站出来了。vuex可以便于项目更加方便的处理这些公用数据,大大减轻了公用数据给项目带来的负担。整体上vuex像是把公用数据放在一个吊篮里面,然后那个组件用就使用吊篮里面的公用数据和方法便可。原创 2021-11-02 21:48:05 · 102 阅读 · 0 评论 -
Vue学习杂记(八)——SPA模式和前端路由
SPA模式和前端路由一、SPA模式介绍二、前端路由工作原理三、配置前端路由一、SPA模式介绍 SPA(single page web application),SPA 是一种特殊的 Web 应用,是加载单个 HTML 页面并在用户与应用程序交互时动态更新该页面的。它将所有的活动局限于一个 Web 页面中,仅在该 Web 页面初始化时加载相应的 HTML 、 JavaScript 、 CSS 。一旦页面加载完成, SPA 不会因为用户的操作而进行页面的重新加载或跳转,而是利用 JavaScript原创 2021-10-18 14:08:38 · 763 阅读 · 0 评论 -
Vue学习杂记(三)——v-slot总结
Vue学习杂记(三)——slot总结一、slot的用途二、slot的使用方法一、slot的用途 如果之前使用过canvas就会记起来一点,像如下代码: <canvas>你的浏览器不支持canvas</canvas> <dynamic-list> <p>你猜猜我会不会显示</p> </dynamic-list>结果是否定的,这样的写法之下dynamic-list组件中的内容将不会被解析,而原创 2021-10-17 13:23:01 · 4650 阅读 · 0 评论 -
Vue学习杂记(七)—— vue-cli的使用以及eslint风格
vue-cli的使用一、什么是vue-cli框架二、如何使用vue-cli三、eslint代码风格引言:前端的发展速度还是比较迅猛的,vue-cli使用前端框架,其设计目的thinkPHP框架一样,为了方便我们进行项目开发,更加专注于代码逻辑,而不用去过多考虑兼容性问题。一、什么是vue-cli框架 简单来说,是一个基于Vue.js和webpack的前端快速开发框架,对于前端开发者来说,了解vue-cli还是有必要的。一般别人习惯把这个vue-cli叫做脚手架,这里我直接成为框架,感觉贴切一些。原创 2021-10-17 01:26:44 · 840 阅读 · 0 评论 -
Vue格式化插件以及v-for报错解决方法
工欲善其事,必先利其器1.Vue插件的使用2.v-for报错解决方案 直接分享下面的博文,方便快速找到有效的解决方案:1.Vue插件的使用 VSCODE的VUE代码格式化插件及配置2.v-for报错解决方案 VS Code使用.vue的v-for方法提示错误的解决办法 声明:本篇文章属于转载,非本人作品,转载请附上原文章链接。...转载 2021-08-31 10:47:08 · 361 阅读 · 0 评论 -
Vue学习杂记(六)——项目发布与sourceMap
Vue学习杂记(六)——项目构建与sourceMap一、项目发布1.1构建生产模式1.2配置clean-webpack-plugin插件1.3对webpack安装的插件的管理二、sourceMap的配置一、项目发布1.1构建生产模式 webpack打包的最后一步便是发布了,首先在package.json文件的"scripts"中添加如下脚本名称和webpack打包方式:"build":"webpack --mode production"终端运行npm run build,这里的build原创 2021-10-13 10:37:02 · 722 阅读 · 0 评论 -
Vue学习杂记(四)——webpack的基本使用
Vue学习杂记(四)——webpack的使用一、什么是webpack?二、如何使用webpack?2.1 webpack的基本使用2.2 webpack的扩展使用引言:webpack是有官网的,这里是看黑马的视频总结的,难免有些片面。官网学习也行、看博文学习也可、看视频学习也罢,咱的目的只有一个,就是将东西学到自己会用,至于博客,主要是作为学习的辅助,就和上课记笔记一个道理。一、什么是webpack? 如今前端开发对于一个项目的要求是:(1)模块化:js的模块化,css的模块化,资源的模块化;原创 2021-10-12 15:03:28 · 283 阅读 · 0 评论 -
Vue学习杂记(二)——组件总结
Vue学习杂记(二)——组件总结一、为什么使用组件?二、组件如何使用?三、父子组件传值的解耦四、组件通信 引言:最近感觉写代码动力不足,觉得自己有点一直很憨的写代码了,因此决定好好学一下Vue,将之前没有掌握的一下关于Vue2.0的细节巩固一下。避免出现没听说过、没讲过的尴尬情况。可能会出系列文章,有些时候想写一些东西,但是笔记本不在身边。比较适合像我一样的主动(或者由于项目进度需要)上手框架,但是基础知识不够扎实的小白。 也曾模仿过基于Vue的框架写过组件,但是对于组件的理解一直不够全面原创 2021-10-11 17:24:37 · 315 阅读 · 0 评论 -
Vue学习杂记(一)——Vue语义(真杂记)
Vue 绑定Class的几种方式一、Vue的初步理解 引言:最近感觉写代码动力不足,觉得自己有点一直很憨的写代码了,因此决定好好学一下Vue,将之前没有掌握的一下关于Vue2.0的细节巩固一下。避免出现没听说过、没讲过的尴尬情况。可能会出系列文章,有些时候想写一些东西,但是笔记本不在身边。比较适合像我一样的主动(或者由于项目进度需要)上手框架,但是基础知识不够扎实的小白。![在这里插入图片描述](https://img-blog.csdnimg.cn/59d1e43a00c14c0fb26e85原创 2021-10-09 21:14:07 · 259 阅读 · 0 评论 -
Vue学习杂记(五)——loader的使用
Vue学习杂记(五)——loader的使用一、什么是loader?二、loader处理css三、loader处理图片四、loader处理高级的js语法参考文献引言:loader其实也是webpack系列的内容,考虑到webpack涉及知识点较多,因此分成两篇。一、什么是loader? loader其实可以理解成webpack一个增强工具。webpack只能加载js,并且对于比较高级的ES7、ES8语法或者较新的react插件中使用的语法,webpack同样无能为力,需要使用loader系列中的b原创 2021-10-12 22:41:13 · 1390 阅读 · 0 评论