- 前言最近在整理基础，欢迎掘友们一起交流学习,关注公众号前端自学社区 结尾有彩蛋哦！ 🎉🎉🎉 Vue Router 路由守卫 导图目录路由守卫分类全局路由守卫单个路由守卫组件路由守卫路由守卫执行的完整过程 路由守卫分类全局路由单个路由独享组件内部路由每个路由守卫的钩子函数都有 3 个参数：to : 进入的目标路由from : 离开的路由next : 控制路由 在跳转时进行的操... 前言最近在整理基础，欢迎掘友们一起交流学习,关注公众号前端自学社区 结尾有彩蛋哦！ 🎉🎉🎉 Vue Router 路由守卫 导图目录路由守卫分类全局路由守卫单个路由守卫组件路由守卫路由守卫执行的完整过程 路由守卫分类全局路由单个路由独享组件内部路由每个路由守卫的钩子函数都有 3 个参数：to : 进入的目标路由from : 离开的路由next : 控制路由 在跳转时进行的操...
- 今天我们一起来看看Vue2中数据劫持的方法 ps:本章脱离vue2单讲数据劫持什么是数据劫持对属性的读取和修改拦截简单来说就是数据的任何变化都要能监测到，这样才能根据数据变化做对应操作为什么要用数据劫持Vue2中data里的数据都是响应式数据，数据一经更改，页面上的数据就会进行局部更新如果不进行数据劫持，不知道数据状态就无从更新数据Vue2中数据劫持使用了Object.defineProp... 今天我们一起来看看Vue2中数据劫持的方法 ps:本章脱离vue2单讲数据劫持什么是数据劫持对属性的读取和修改拦截简单来说就是数据的任何变化都要能监测到，这样才能根据数据变化做对应操作为什么要用数据劫持Vue2中data里的数据都是响应式数据，数据一经更改，页面上的数据就会进行局部更新如果不进行数据劫持，不知道数据状态就无从更新数据Vue2中数据劫持使用了Object.defineProp...
- 前言:上一篇讲解了defineProperty方法今天来讲讲proxyvue3中数据劫持使用了proxy主要是因为defineProperty有几项缺点新增属性，删除属性直接通过下标修改数组defineProperty缺点讲解//先回顾上期知识点 let person = { name:'vike', age:5 } // 回顾上篇de... 前言:上一篇讲解了defineProperty方法今天来讲讲proxyvue3中数据劫持使用了proxy主要是因为defineProperty有几项缺点新增属性，删除属性直接通过下标修改数组defineProperty缺点讲解//先回顾上期知识点 let person = { name:'vike', age:5 } // 回顾上篇de...
- Vue3组件库-消息提示组件简易消息提示自定义消息提示函数调用消息提示 简易消息提示效果预览先在App.vue 文件里 引入写好的Button组件新建一个Snackbar.vue作为组件的文件给button添加click事件，通过show属性控制消息提示框的显示与隐藏注意点:show前面增加了v-model 这是为了在组件里修改props接收到show的值props里的属性是单向数据 不能... Vue3组件库-消息提示组件简易消息提示自定义消息提示函数调用消息提示 简易消息提示效果预览先在App.vue 文件里 引入写好的Button组件新建一个Snackbar.vue作为组件的文件给button添加click事件，通过show属性控制消息提示框的显示与隐藏注意点:show前面增加了v-model 这是为了在组件里修改props接收到show的值props里的属性是单向数据 不能...
- VUE3组件库-input组件大家好，今天一起来学习vue3实现input组件，希望对你有帮助目录预览基本使用朴素模式文本域模式基本使用效果失焦状态下- 聚焦状态下- 新建Input.vue文件用来存放input代码 - div样式上加个定位，以防label跑出盒子 - 给input框加上对应样式 并用v-model绑定值 ``` <template... VUE3组件库-input组件大家好，今天一起来学习vue3实现input组件，希望对你有帮助目录预览基本使用朴素模式文本域模式基本使用效果失焦状态下- 聚焦状态下- 新建Input.vue文件用来存放input代码 - div样式上加个定位，以防label跑出盒子 - 给input框加上对应样式 并用v-model绑定值 ``` <template...
- Button组件实现实现一款vue3组件库 simple组件库正在开发中~~~button作为组件库基础组件,逻辑比较简单，主要是样式的编写。 simple button功能点一览主题色按钮文字按钮禁用状态按钮尺寸块级按钮自定义颜色圆形加载 主题色按钮效果预览新建一个Button.vue文件，并在App.vue中引入Button组件中写个button标签，并给一个初始class，中间使用一... Button组件实现实现一款vue3组件库 simple组件库正在开发中~~~button作为组件库基础组件,逻辑比较简单，主要是样式的编写。 simple button功能点一览主题色按钮文字按钮禁用状态按钮尺寸块级按钮自定义颜色圆形加载 主题色按钮效果预览新建一个Button.vue文件，并在App.vue中引入Button组件中写个button标签，并给一个初始class，中间使用一...
- Vue3 自定义指令详解Vue中有v-if,v-for,v-bind，v-show,v-model…等等一系列方便快捷的指令今天一起来了解一下vue里提供的自定义指令 Vue3 自定义指令生命周期created 元素初始化的时候beforeMount 指令绑定到元素后调用 只调用一次mounted 元素插入父级dom调用beforeUpdate 元素被更新之前调用update 这个周期方法... Vue3 自定义指令详解Vue中有v-if,v-for,v-bind，v-show,v-model…等等一系列方便快捷的指令今天一起来了解一下vue里提供的自定义指令 Vue3 自定义指令生命周期created 元素初始化的时候beforeMount 指令绑定到元素后调用 只调用一次mounted 元素插入父级dom调用beforeUpdate 元素被更新之前调用update 这个周期方法...
- Hello，你好呀，我是灰小猿，一个超会写bug的程序猿！今天在做vue和springboot交互的一个项目的时候，想要基于前端实现一些只有登录验证之后才能访问某些页面的操作，所以在这里总结一下实现该功能的一个解决方案，首先说一下我是如何判断是否已经登录的， 一、解决思路由于在我的springboot后台采用的shiro+Jwt安全框架，所以会在登录之后反馈给前端一个token，并且前端会将... Hello，你好呀，我是灰小猿，一个超会写bug的程序猿！今天在做vue和springboot交互的一个项目的时候，想要基于前端实现一些只有登录验证之后才能访问某些页面的操作，所以在这里总结一下实现该功能的一个解决方案，首先说一下我是如何判断是否已经登录的， 一、解决思路由于在我的springboot后台采用的shiro+Jwt安全框架，所以会在登录之后反馈给前端一个token，并且前端会将...
- 是什么组合（composition）API的入口 setup 所处的生命周期beforeCreate -> use setup()created -> use setup()beforeMount -> onBeforeMountmounted -> onMountedbeforeUpdate -> onBeforeUpdateupdated -> onUpdatedbeforeDestr... 是什么组合（composition）API的入口 setup 所处的生命周期beforeCreate -> use setup()created -> use setup()beforeMount -> onBeforeMountmounted -> onMountedbeforeUpdate -> onBeforeUpdateupdated -> onUpdatedbeforeDestr...
- 是什么将基础数据–>响应式数据 ==> 把值类型的数据包装编程响应式的引用类型的数据函数通过返回值的 value 属性获取响应式的值 ，修改也需要对 .value进行修改。获取元素在Vue2.x通过给元素添加ref=‘xxx’,,然后使用refs.xxx的方式来获取元素在Vue3.x中我们也可以通过ref来获取元素 用法 创建变量import { ref } from 'vue'con... 是什么将基础数据–>响应式数据 ==> 把值类型的数据包装编程响应式的引用类型的数据函数通过返回值的 value 属性获取响应式的值 ，修改也需要对 .value进行修改。获取元素在Vue2.x通过给元素添加ref=‘xxx’,,然后使用refs.xxx的方式来获取元素在Vue3.x中我们也可以通过ref来获取元素 用法 创建变量import { ref } from 'vue'con...
- 是什么将引用类型数据–>响应式数据 ==> 把值类型的数据包装编程响应式的引用类型的数据object array map set weakmap weakset函数reactive参数必须是对象(json/arr)默认情况下修改对象, 界面不会自动更如果想更新, 可以通过重新赋值的方式本质: 将传入的数据包装成一个Proxy对象 用法 创建变量 案例1import {reactive}... 是什么将引用类型数据–>响应式数据 ==> 把值类型的数据包装编程响应式的引用类型的数据object array map set weakmap weakset函数reactive参数必须是对象(json/arr)默认情况下修改对象, 界面不会自动更如果想更新, 可以通过重新赋值的方式本质: 将传入的数据包装成一个Proxy对象 用法 创建变量 案例1import {reactive}...
- index.jsindex 文件夹主要是为了导出vuex提供的模块import { Store, install } from './store'import { mapState, mapMutations, mapGetters, mapActions, createNamespacedHelpers } from './helpers'`export default {` `Sto... index.jsindex 文件夹主要是为了导出vuex提供的模块import { Store, install } from './store'import { mapState, mapMutations, mapGetters, mapActions, createNamespacedHelpers } from './helpers'`export default {` `Sto...
- ！！！ 这个例子可以先忽略mutations 初始化一个stateconst store = new Vuex.Store({ state: { name: "old name", age: 18, sex: "女", }, mutations: { changName(state) { sta... ！！！ 这个例子可以先忽略mutations 初始化一个stateconst store = new Vuex.Store({ state: { name: "old name", age: 18, sex: "女", }, mutations: { changName(state) { sta...
- Mutations是啥------修改修改修改 更改 Vuex 的 store 中的state在前面我们知道如何去获取state里面的值，可以直接使用state.XX来获取，也可以使用Getter来获取state。但是我们要如何去更改state，这就是Mutations。我们要如何调用Mutations的函数呢。这就要用到commit函数，const store = new Vuex.St... Mutations是啥------修改修改修改 更改 Vuex 的 store 中的state在前面我们知道如何去获取state里面的值，可以直接使用state.XX来获取，也可以使用Getter来获取state。但是我们要如何去更改state，这就是Mutations。我们要如何调用Mutations的函数呢。这就要用到commit函数，const store = new Vuex.St...
- Mutations是啥------修改修改修改 更改 Vuex 的 store 中的state在前面我们知道如何去获取state里面的值，可以直接使用state.XX来获取，也可以使用Getter来获取state。但是我们要如何去更改state，这就是Mutations。我们要如何调用Mutations的函数呢。这就要用到commit函数，const store = new Vuex.St... Mutations是啥------修改修改修改 更改 Vuex 的 store 中的state在前面我们知道如何去获取state里面的值，可以直接使用state.XX来获取，也可以使用Getter来获取state。但是我们要如何去更改state，这就是Mutations。我们要如何调用Mutations的函数呢。这就要用到commit函数，const store = new Vuex.St...
上滑加载中
推荐直播
-
华为云码道Skill实战与极速交付，智能开发全链路实战2026/07/22 周三 19:00-21:00
王一男-华为云码道产品规划专家；李炎-华为云码道产品专家；姜浩-华为云HCDG核心组成员
直播深度解读华为云码道6月产品新特性，从Skill市场安装专家技能，带你零距离体验从需求，开发，审查，重构全链路闭环的开发过程。从零构建并交付一个完整项目，让您体验从代码提交到服务上线的“极速”之旅。
回顾中 -
聚开发者之力，创具身新未来2026/07/23 周四 15:00-17:00
张豪杰/程文/王军/刘新春/黄钦开 /张晓天
本次华为云具身智能开发平台CloudRobo培训面向具身智能开发者，带您全流程体验机器人本体R2C小时级接入、环境重建与轨迹生成仿真数据生产、PB级数据管理、数据评测、模型训推、强化学习和Benchmark一键评测等功能，并体验业界主流具身模型应用。
回顾中
热门标签