Vue学习笔记

Vue学习笔记(8.24)

认识Vue基本概念：Vue是一个用于构建用户界面（基于数据构建出用户能够看懂的界面）的渐进式框架Vue的两种使用方式Vue核心包开发Vue核心包&Vue插件工程化开发优点：大大提升了开发效率缺点：需要记忆创建Vue实例准备容器引包–开发版本/生产版本，去官网找https://v2.cn.vuejs.org/v2/guide/installation.html创建Vue实例指定配置项el指定挂载点d
辰尘-·2023-08-25 06:30

Vue学习笔记-ElmentUI表单校验

Elment-UI的Form组件提供了表单验证的功能：1.将Form-Item的prop属性设置为需校验的字段名2.通过rules属性传入约定的验证规则rules:{name:[{required:true,//非空校验message:'提示信息',//校验提示信息trigger:'blur'//触发条件：blur、change}]踩坑：1.要验证输入只能为数字时{type:'number',me
赵客缦胡缨v吴钩霜雪明·2023-08-23 00:50

vscode-vue项目格式化+语法检验-草稿

Vue学习笔记7-在Vscode中配置Vetur，ESlint，Prettier_vetur规则_Myron.Maoyz的博客-CSDN博客
startyangu·2023-08-22 09:55

Vue学习笔记

前言前后分离的开发思想主要时基于Soc(关注度分离原则)！什么是CSS预处理器CSS预处理器定义了一种新的语言，其基本思想是，用一种专门的编程语言，为CSS增加了一些编程的特性，将CSS作为目标生成文件，然后开发者就只要使用这种语言进行CSS的编码工作。转化成通俗易懂的话来说就是“用一种专门的编程语言，进行Web页面样式设计，再通过编译器转化为正常的CSS文件，以供项目使用”。常用的CSS预处理器
AIoneT·2023-08-21 03:39

vue 学习笔记

VUE学习笔记1简介1.1简介中文网https://cn.vuejs.org/v2/guide/Vue(读音/vjuː/，类似于view)是一套用于构建用户界面的渐进式框架。
墨竹闲人·2023-08-21 03:08

Vue学习笔记 5 - webpack 安装/文件配置

webpack前面我们学习了为什么前端需要模块化，并且提到目前使用前端模块化的一些方案：AMD、CMD、CommonJS、ES6。在ES6之前，我们必须借助其他工具来进行模块化开发，开发完成后还需要处理模块间的各种依赖，并将其进行整合打包。webpack其中一个核心就是让我们可能进行模块化开发，并帮助我们处理模块间的依赖关系。而且不仅是JavaScirpt文件，我们的CSS、图片、json文件等在
Caramely·2023-08-21 03:36

Vue学习笔记 6 - 使用 Vue 的配置过程/组件化开发引入/文件封装处理/ plugin /搭建本地服务器/配置文件的分离

webpack官网链接：webpack中文文档webpack使用Vue的配置过程引入Vue.js后续项目中，我们会使用Vue.js进行开发，而且会以特殊的文件来组织vue的组件。那么如何在webpack环境中集成Vue.js呢？我们希望在项目中使用Vue.js，那么必然需要对其有依赖，所以需要先进行安装。因为我们后续在实际开发中也会使用vue，所以并不是开发时依赖(使用的是–save-dev)np
Caramely·2023-08-21 03:36

Vue学习笔记[14]-vue-router使用嵌套路由&传递路由参数

当前我们配置的路由都只有一层，要配置多层路由，需要用到嵌套路由。//index.jsconstroutes=[//...{path:'/home',component:Home,children:[{path:'news',component:HomeNews},{path:'message',component:HomeMessage}]},]constrouter=newVueRouter({
神楽花菜·2023-08-20 20:35

前端技术Vue学习笔记--005

Vue学习笔记一、非父子通信-eventbus事件总线作用：非父子组件之间，进行简易消息传递。
Radan小哥·2023-08-20 03:08

前端技术Vue学习笔记--004

Vue学习文章目录Vue学习一、scoped解决样式冲突二、data必须是一个函数三、组件通信3.1、组件关系3.2、组件通信解决方案3.3、父传子通信3.4、子传父通信3.5、组件通信案例四、prop语法4.1、prop语法基础语法4.2、prop校验4.3、prop&data、单向数据流一、scoped解决样式冲突写在组件中的样式会全局生效→因此很容易造成多个组件之间的样式冲突问题。全局样式:
Radan小哥·2023-08-20 03:07

Vue学习笔记：axios 拦截器的用法

Vue学习笔记：axios拦截器的用法什么是axios拦截器？拦截器就是拦截每一次的请求和响应，然后进行相应的处理。
前端互助会·2023-08-19 07:13

Vue学习笔记九：Vue-axios

1.使用axios//安装npminstall--saveaxios//组件内引入importaxiosfrom'axios'//发送post请求(基于Pormise的)axios.post("http://mp.yc.info",this.blog).then((res)=>{this.arr=resconsole.log(res)}).then((res)=>{})2.全局配置main.js文
开发者连小超·2023-08-19 03:12

vue学习笔记-遗留问题记录

Node.js是什么？对node.js的理解官网解释：Node.js是一个基于ChromeV8引擎的JavaScript运行时。这是一种通过JavaScript语言开发web服务端的东西Node是一个服务器程序。但是，基础Node产品肯定不像Apache或Tomcatnode.js有非阻塞，事件驱动I/O等特性，从而让高并发（highconcurrency）在的轮询（Polling）和comet构
Taowd·2023-08-17 20:38

vue学习笔记

1.官网v2官网https://v2.cn.vuejs.org/v3官网https://cn.vuejs.org/2.vue引入在线引入下载引入(下载链接)https://v2.cn.vuejs.org/js/vue.js3.初始化渲染的核心步骤4.插值表达式5.6.插件下载VueDevtoolshttps://chrome.zzzmh.cn/info/nhdogjmejiglipccpnnnan
唏嘘南溪·2023-08-15 05:01

前端技术Vue学习笔记--003

前端技术Vue学习笔记文章目录前端技术Vue学习笔记1、Vue生命周期和生命周期的四个阶段1.1、Vue生命周期1.2、生命周期的四个阶段1.3、Vue生命周期函数（钩子函数）2、小黑记账本（案例）3、
Radan小哥·2023-08-14 04:33

Vue学习笔记------Vue入门（一）

Vue是什么Vue是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue被设计为可以自底向上逐层应用。Vue的特点遵循MVVM模式编码简洁,体积小,运行效率高,适合移动/PC端开发它本身只关注UI,也可以引入其它第三方库开发项目起步创建一个html文件，引入vue.js想让Vue工作，就必须创建一个Vue实例，且要传入一个配置对象root容器里的代码依然符合html规范，只不过混入了一
神秘的帅哥·2023-08-08 08:26

VUE学习笔记：7.v-model指令讲解

1.v-model介绍v-model主要用来操作input标签，实现标签与数据的双向绑定双向绑定：即改变vue中数据的值会导致input标签中的值改变，同理改变input标签中的值来也会导致vue中数据的值改变。能双向绑定的input标签包括：text格式，select格式和textarea格式，radio格式，checkbox格式等2.v-model的基本使用格式如下：#将input标签与数据m
new nm个对象·2023-08-08 08:25

Vue学习笔记（一）

一.了不起的vue1.官方介绍Vue(读音/vjuː/，类似于view)是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue被设计为可以自底向上逐层应用。Vue的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue也完全能够为复杂的单页应用提供驱动。2.渐进式框架做分层设计，每层都可选，不同层可以灵活接入其他
千锋HTML5学院·2023-08-06 00:05

前端技术Vue学习笔记--002

前端技术Vue学习笔记文章目录前端技术Vue学习笔记1、指令修饰符2、v-bind对于样式控制的增强2.1、v-bind对于样式控制的增强--class2.2、v-bind对于样式控制的增强--操作style3
Radan小哥·2023-08-02 22:47

一个Java后端的Vue自学笔记

本人最近自学了一些Vue的皮毛，写下这篇博客不是为了哗众取宠，权当是为自己做一个Vue学习笔记。这篇博客主要记录了我学习Vue基础知识，完成一个TodoList小功能的开发过程。
Haozz_1994·2023-07-29 05:33

Day42——Vue学习笔记

Vue入门文章目录Vue入门NodeJS学习VueV-bind条件与循环V-ifV-for双向绑定事件：v-on(@)路由axios实战Vue.js学习地址补充webpack的学习它为前端框架前端化工程开发工具：VScode（推荐）前端环境：NodeJS下载地址：https://code.visualstudio.com/docs/?dv=winhttps://nodejs.org/en/如何验证
fenglgC·2023-07-28 00:44

VUE学习笔记（Day2）

第一节—style样式的多种操作方式1.绑定内联样式1.对象语法：v-bind:style的对象语法十分直观——看着非常像CSS，但其实是一个JavaScript对象。CSSproperty名可以用驼峰式或短横线分隔（记得用引号括起来）来命名：data:{activeColor:'red',fontSize:30}2.条件渲染v-if1.v-if指令用于条件性地渲染一块内容，这块内容只会在指令的表
你猜我是不是ysh·2023-07-28 00:11

vue学习笔记---增删、小选影响全选、全选影响小选

1.添加任务//1.目标-新增任务exportdefault{data(){return{task:""}},methods:{downFn(){if(this.task.trim().length===0){alert("任务名不能为空");return;}//1.2(重要)-当前任务名字要加到list数组里//子传父技术this.$emit("create",this.task)this.ta
不想努力的迪迪·2023-07-27 10:40

vue学习笔记 element-plus/icons-vue el-menu动态菜单(路由)

安装iconnpminstall@element-plus/icons-vue当前版本"dependencies":{"@element-plus/icons-vue":"^0.2.4","core-js":"^3.8.3","element-plus":"^1.3.0-beta.1","node-sass":"^7.0.1","sass-loader":"^12.4.0","vue":"^3.2
xjcwzp·2023-07-26 23:36

Vue学习笔记 store 找不到Module里的action

子模块user.tsconstmoduleUser={state:():{username:"",}),mutations:{},actions:{login({commit}:any){console.log("login");},},getters:{},};exportdefaultmoduleUser;store的index.tsimport{createStore}from"vuex";
xjcwzp·2023-07-26 23:36

vue学习笔记 el-dialog 固定宽度

1、按比例显示width=“30%”这是一段信息取消确定2固定宽度(部分Element版本):width="‘500px’"，注意引号这是一段信息取消确定3固定宽度(部分Element版本)width=“500px”这是一段信息取消确定
xjcwzp·2023-07-26 23:06

vue学习笔记 修改el-card样式

卡片名称操作按钮exportdefault{name:"DevSort",};.card-header{display:flex;justify-content:space-between;align-items:center;}.text{font-size:14px;}.item{margin-bottom:0px;margin-top:10px;}.box-card{width:480px;
xjcwzp·2023-07-26 23:06

vue学习笔记 element-plus export ‘createElementVNode‘ (imported as ‘_createElementVNode‘) was not found

VueCLI版本是5.0.0-beta.3创建新项目后，运行正常安装element-plus运行报错export‘createElementVNode’(importedas‘_createElementVNode’)wasnotfoundin‘vue’浏览器中报错误UncaughtTypeError:(0,vue__WEBPACK_IMPORTED_MODULE_0__.createElemen
xjcwzp·2023-07-26 23:36

vue学习笔记 VUE3 v-for 中使用ref

参考：VUE3.0之v-for中的Ref数组{{tag.title}}moveToCurrentTag(){consttags=this.$refs.tag;this.$nextTick(()=>{for(consttagoftags){if(tag.to.path===this.$route.path){this.$refs.scrollPane.moveToTarget(tag);//when
xjcwzp·2023-07-26 23:35

vue学习笔记 el-scrollbar 隐藏横向滚动条

在学习vue过程中，学习侧边菜单，使用el-scrollbar，需要隐藏横向滚动条sidebar.scss#app{$sideBarWidth:220px;$menuBg:#304156;.sidebar-container{...//隐藏横向滚动条.el-scrollbar__wrap{overflow-x:hidden!important;}.el-scrollbar__bar.is-hori
xjcwzp·2023-07-26 23:35

vue学习笔记 No matching version found for @vue/cli-plugin-babel@~5.0.0.

在创建项目时，选择了babel，创建失败，提示Nomatchingversionfoundfor@vue/cli-plugin-babel@~5.0.0@vue/cli-plugin-babel中查找相关版本，安装本人未找到对应版本，没有解决此问题。最后将VueCLI升级才解决的，
xjcwzp·2023-07-26 23:35

vue学习笔记 vue-cli4.5.13 创建项目报错

vue-cli4.5.13vue3.0.0或vue3.1.3创建完项目后，运行报如下错误reactivity.esm-bundler.js解决方法1：https://download.csdn.net/download/m0_58006422/19987970替换文件reactivity.esm-bundler.js替换后错误消失，具体怎么解决的，本人相关知识有限，看不明白解决方法2：升级vue到
xjcwzp·2023-07-26 23:05

vue学习笔记 vue页面四周留有空白问题

参考：vue组件顶部留有空白问题vue3新建项目后，发现页面四周有留白解决办法：修改index.html样式添加样式body{margin:0;padding:0;}index.html如下body{margin:0;padding:0;}favicon.ico">We'resorrybutdoesn'tworkproperlywithoutJavaScriptenabled.Pleaseenab
xjcwzp·2023-07-26 23:05

vue学习笔记 export ‘default‘ (imported as ‘Vue‘) was not found in ‘vue‘

版本：vue3vue/cli5.0.0做写store时报错importVuefrom"vue";importVuexfrom"vuex";importgettersfrom"./getters";importuserfrom"./modules/user";Vue.use(Vuex);conststore=newVuex.Store({modules:{user,},getters,});expo
xjcwzp·2023-07-26 23:05

vue学习笔记 vue cli4.5 创建项目

vuecreatevuetest2Manuallyselectfeatures手动配置Useclass-stylecomponentsyntax?(Y/n)是否使用class风格的组件语法？UseBabelalongsideTypeScript(requiredformodernmode,auto-detectedpolyfills,transpilingJSX)?使用babel工具自动为转换后的
xjcwzp·2023-07-26 23:35

vue基础学习笔记

VUE学习笔记Vue框架第一个Vue程序el挂载点data数据对象Vue指令内容绑定v-text，v-html事件绑定v-on显示切换v-show,v-if属性绑定v-bindv-for列表循环v-model
暄染落墨·2023-07-25 15:52

vue学习笔记——Vue3+element ui 如何在table组件内实现下拉列表的功能

在使用elementuiplus时，想要在table组件内加入一个下拉列表的功能，发现在文档内没有展现，通过查阅其他文档发现可以使用如下的方法进行实现。下方是组件的完成代码，复制在项目内可直接看到效果。代码如下：exportdefault{data(){return{tableData:[{date:"2016-05-03",name:"Tom",address:"No.189,GroveSt,L
chen_sir_sh·2023-07-25 10:27

前端技术Vue学习笔记--001

前端技术Vue学习笔记文章目录前端技术Vue学习笔记1、Vue2和Vue3比较2、Vue简介3、Vue快速上手4、插值表达式{{}}5、Vue响应式特性6、Vue指令6.1、v-html指令6.2、v-show
Radan小哥·2023-07-25 00:36

Vue学习笔记-Day1 认识Vue

day1--认识Vue起源：2013年6月—google工作的尤雨溪收到Angular的启发，从中提取除了自己喜欢的部分，而开发出的一款轻量级框架，最初命名Seed，本意是做一个视图层库。2013年12月—更名为vue，版本为0.6.02014年1月—第一次进行正式发布V0.8.02015年4月—发布0.12.0版本，vue进入Laravel社区，打响了知名度2015年10月—V1.0Evange
小菜鸡的日常问题·2023-07-20 13:08

vue学习笔记（一）

1.编辑器选择是用vscode和webstrom个人感觉vscode的插件比较多，对vue3的支持比较好webstorm的自动保存比较好各有优劣吧我学习的这个项目目前采用vscode2.vue2还是vue3框架学通了都是通用的，这个时间点来学肯定是学vue3只是顾虑到团队小伙伴采用的都是vue2历史项目都还是根据vue2来后续新项目采用vue33.element-ui习惯于vue2开发的都是采用的
石硕页·2023-07-20 00:48

vue学习笔记--数据代理

目录1.什么是数据代理？2.vue数据代理:1.什么是数据代理？数据代理：通过一个对象代理对另一个对象中属性的操作(读/写)。下面我们通过一个简单的例子来了解什么是数据代理：1.我们定义了两个对象obj和obj22.然后通过Object.defineProperty()方法给obj2的对象上面添加了一个属性x在配置对象中我们定义了get()方法和set()方法3.当我们访问obj2的x属性时触发g
清浅九天·2023-07-19 20:30

Vue学习笔记

目录浏览器插件安装（重点关注）为什么学Vue？Vue是什么？2.@vue/cli脚手架2.1_@vue/cli安装2.2_@vue/cli创建项目启动服务2.3@vue/cli目录和代码分析2.5_@vue/cli自定义配置2.6_eslint检查代码2.7_@vue/cli单vue文件讲解2.8_@vue/cli欢迎界面清理写出第一个vue的helloworld学习Vue中的指令：1.插值表达式
hanjuyuan·2023-07-19 12:06

Vue学习笔记---ajax

1.axios执行ajax异步请求请求形式：get请求：axios.get().then().catch()post请求：axios.post().then().catch()并发请求：axios.all([axios请求,axios请求]).then(axios.spread(function(acct,perms)))配置请求：axios(config)、axios(url[,config])
洛千陨·2023-07-18 03:37

FE_Vue学习笔记 框架的执行流程详解

1分析脚手架结构（1）CLI就是commandlineinterface的缩写。VueCLI官网：VueCLI（2）安装过程：（PS：提前安装过node.js了，没有安装的可以打开这个：Download|Node.js已经安装的可以检查node.js和npm版本及安装情况：检查nodejs：node-v检查npm：npm-v（这两个指令均出现版本号为安装成功））①配置npm淘宝镜像：npmconf
@Autowire·2023-07-17 02:30

Vue学习笔记 —— 生命周期

什么是生命周期？每个Vue实例在被创建之前都会经过一系列的初始化过程,这个过程就是vue的生命周期。同时Vue在一整个生命周期中，提供了很多钩子函数。利用这些钩子函数，我们可以在生命周期的不同时刻进行操作。钩子函数如下：beforeCreate------------创建前状态created------------创建完毕状态beforeMount------------挂载前状态mounted-
莫非C·2023-07-17 02:29

vue 声明周期函数_Vue学习笔记-生命周期与钩子函数

vue生命周期简介生命周期探究{{message}}varapp=newVue({el:'#app',data:{message:"xuxiaoisboy"},beforeCreate:function(){console.group('beforeCreate创建前状态===============》');console.log("%c%s","color:red","el:"+this.$el
osakadorisss·2023-07-17 02:58

vue学习笔记-点击li给当前li添加背景色（3）

vue点击li给当前li添加背景色思路1：循环li列表并且获取到当前li的索引值看代码：{{msg}}获取表单数据设置表单数据{{item}}exportdefault{name:'app',data(){return{msg:'你好vue',list:['1111','2222','3333']}},methods:{getMsg(){alert(this.msg)},setMsg(){aler
键指江湖·2023-07-16 08:40

Vue学习笔记-从0到1搭建实战项目

新建项目vuecreatehello1注：项目名称不能有大写字母（Warning:namecannolongercontaincapitalletters）新建项目vuecreatehello1http://localhost:8080/vscode导入文件用vscode导入文件新增页面1.新增文件views/introduce.vueThisisanintroducepage2.App.vue新
wyx100·2023-07-15 16:06

VUE学习笔记009 路由router

使用a标签home1helloworld1使用router-link有点，点击跳转时不刷新页面home1helloworld1
梦想_15eb·2023-07-15 09:00

VUE学习笔记--组件

文章目录组件化开发vue组件的三个组成部分启用less组件之间的父子关系使用组件路径提示插件注册私有组件注册全局组件快速生成vue代码框架插件自动闭合标签插件组件化开发vue组件的三个组成部分template中只能有一个根元素启用less组件之间的父子关系使用组件路径提示插件@为src所在的路径位置，即@为src该插件的配置在vscode的设置中配置//导入文件时是否携带文件拓展名"path-au
萤火虫的小尾巴·2023-07-15 03:26
上一页 1 2 3 4 5 6 7 8 下一页
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他