- 博客(48)
- 收藏
- 关注
RSS订阅原创 10_Vue3 其它的组合式API（Composition API）
Vue3 中的其它组合式API1.shallowReactive 与 shallowRef2. readonly 与 shallowReadonly3.toRaw 与 markRaw4.customRef5.provide 与 inject6.响应式数据的判断
2023-08-08 17:46:25
187
原创 08_Vue3 自定义hook函数
什么是 hook?——本质是一个函数，把 setup 函数中使用的 Composition API 进行了封装。类似于 vue2 中的 mixin。自定义hook的优势：复用代码，让 setup 中的逻辑更清楚易懂。
2023-08-04 16:58:30
359
1
原创 06_Vue3中的计算属性与监视
一、computed函数与Vue2中computed配置功能一致二、watch函数与Vue2中watch配置功能一致两个“小坑”监视reactive定义的响应式数据时：oldValue无法正确获取，强制开启了深度监视（deep配置也无效）。监视reactive定义的响应式数据中某个属性（这个属性的值是一个对象）时：deep配置有效。解答：watch函数监视ref定义的响应式数据是否需要加 .value由ref定义的响应式数据，若数据为基本数据类型，则不需要.value；若数据为对象这种引
2023-08-04 11:24:18
306
原创 Vue3_03_setup函数
若返回一个对象，则对象中的属性、方法，在模板中均可以直接使用（重点关注！3.组件中所用到的：数据、方法等等，均要配置在setup中。1.理解：Vue3.0 中的一个新的配置项，值为一个函数。2.setup是所有组合式 API 表演的舞台。
2023-08-02 15:49:16
248
原创 Vue3_01简介及优势
1.性能的提升2.源码的升级（使用Proxy代替defineProperty实现响应式；重写虚拟DOM的实现和Tree-Shaking）3.拥抱TypeScript4.新的特性
2023-07-31 17:38:36
43
原创 vue3前端项目笔记_01_概述
6.主题颜色切换与暗黑模式的切换。2.从零开始，封装后台管理系统。5.svg矢量图在项目中的应用。Vue3 + 组合式API。3.菜单权限与按钮权限。1.企业级的编码规范。Pinia 状态管理。Axios 网络交互。
2023-07-31 10:36:58
183
原创 Vue_路由
理解：一个路由（router）就是一组映射关系（key-value），多个路由需要路由器进行管理。前端路由：key是路径，value是组件。
2023-04-06 10:29:39
164
1
原创 Vuex中4个map方法的使用
注意：mapActions与mapMutations使用时，若需要传递参数，需要：在模板中绑定事件时传递好参数，否则参数是事件对象。用于帮助我们生成actions对话的方法，即：包含$store.dispatch(xxx)的函数。用于帮助我们生成与actions对话的方法，即：包含$store.commit(xxx)的函数。用于帮助我们映射getters中的数据为计算属性。用于帮助我们映射state中的数据为计算属性。4.mapMutations方法。2.mapGetters方法。
2023-04-04 11:34:03
149
原创 Vuex的工作原理、环境搭建和基本使用
在Vue中事件集中式状态（数据）管理的一个Vue插件，对Vue应用中多个组件的共享状态进行集中式的管理（度、写），也是一种组件间通信的方式，且适用于任意组件间通信。
2023-04-03 14:53:39
193
原创 Vue插槽
前边学习过组件基础后，我们知道组件能够接收任意类型的 JavaScript 值作为 props，但组件要如何接收模板内容呢？ 在某些场景中，我们可能想要为子组件传递一些模板片段，让子组件在它们的组件中渲染这些片段。除了通过函数传值，还可以用插槽。例如有个子组件Category.vue，其模板为：在父组件中使用如下：<slot></slot>用于指定父元素提供的内容所放的位置。例如有个子组件Category.vue，其模板为：在父组件中使用如下：button元素会被放在插槽
2023-04-03 10:43:13
64
1
原创 Vue全局事件总线
①接收数据：A组件想接收数据，则在A组件中给$bus绑定自定义事件，4. 最好在beforeCreate钩子中，用$off去解绑。1. 一种组件间通信的方式，适用于任意组件间通信。事件的回调留在A组件自身。2. 安装全局事件总线。
2023-03-30 15:34:24
64
原创 Vue中的配置项props
传递数据：App.vue中代码如下 接收数据：子组件MyStudent.vue中不使用配置项props第一种方式（只接收）第二种方式（限制类型）第三种方式（限制类型、限制必要性、指定默认值）如何修改呢？props不能直接修改，可以通过修改data中的数据进行修改。总结
2023-03-28 14:59:48
117
原创 Vue中的ref 属性
2. 应用在html标签上获取的是真实的DOM元素，应用在组件标签上是组件实例对象（vc）.1. 被用来给元素或子组件注册引用信息（id的替代者）。
2023-03-28 09:41:06
184
原创 20_vue cli 脚手架
如果报错，可以先下载，再安装即可。用vue cli 创建一个vue项目vue_test打开所创建的vue_test文件夹如下 哪些文件或文件夹不想接收Git的管理，在此文件中配置好。ES6转ES5的配置文件。用于放一些静态资源，如.png图片，视频等。public文件夹favicon.ico：页签图标index.html：要展示的页面main.js中的render函数为什么要引入精简版vue，而不引入完整版？ 打包的时候能够节省空间，所以用到render函数 总结Vue 脚手架隐
2023-03-27 17:29:33
69
原创 19_Vue单文件组件
单文件组件命名方式；.vue文件整体结构；3.数据暴露方式export 分别暴露；export {school} 统一暴露；export default school 默认暴露。；4.Vue项目中各文件的关系
2023-03-27 10:50:27
34
原创 17_模块、组件、模块化、组件化
模块理解：向外提供特定功能的js 程序，一般就是一个js文件为什么： js 文件很多很复杂作用：复用js，简化js的编写，提高js运行效率组件理解：用来实现局部(特定)功能效果的代码集（html/css/js/image.....）为什么：一个界面的功能很复杂作用：复用编码，简化项目编码，提高运行效率模块化当应用中的js都以模块来编写的，那这个应用就是一个模块化的应用。组件化当应用中的功能都是多组件的方式来编写的，那这个应用就是一个组件化的应用。
2023-03-24 15:15:10
66
原创 16_Vue自定义指令
new Vue({directives:{指令名:配置对象}})或new Vue({directive{指令名:回调函数}})Vue.directive(指令名,配置对象)或Vue.directive(指令名，回调函数)需求：定义一个v-big指令，和v-text功能类似，但会把绑定的数值放大10倍//big函数何时会被调用？1.指令与元素成功绑定时（一上来） 2.指令所在的模板被重新解析时-- 需求：定义一个v-big指令，和v-text功能类似，但会把绑定的数值放大10倍 -->
2023-03-23 12:06:57
98
原创 15_Vue内置指令
v-text指令1.作用：向其所在的节点中渲染文本内容2.与插值语法的区别：v-text会替换掉节点中的内容，插值语法{{xx}}则不会。v-html指令1.作用：向指定节点中渲染包含html结构的内容2.与插值语法的区别v-cloak指令v-once指令v-pre指令
2023-03-21 17:36:33
41
原创 15_Vue内置指令
v-text指令1.作用：向其所在的节点中渲染文本内容2.与插值语法的区别：v-text会替换掉节点中的内容，插值语法{{xx}}则不会。v-html指令v-cloak指令(没有值)v-once指令v-pre指令
2023-03-21 17:16:41
38
原创 14_Vue中的过滤器
过滤器定义：对要显示的数据进行特定格式化后再显示(适用于一些简单逻辑的处理)。语法：1.注册过滤器： 全局注册：Vue.filter(name,callback) 或 局部注册：new Vue{filters:{ }}；2.使用过滤器：{{ xxx | 过滤器名}}或 v-bind:属性 ="xxx |过滤器名"。备注：1.过滤器也可以接收额外参数、多个过滤器也可以串联；2.并没有改变原本的数据，是产生新的对应的数据。得到一个时间戳，显示格式后的时间计算属性实现、methods实现、过滤器实
2023-03-21 14:08:44
56
原创 13_Vue收集表单数据
收集表单数据若：，则v-model收集的是value值，用户输入的就是value值。若：，则v-model收集的是value值，且要给标签配置value值。若：，1.没有配置input的value属性，那么收集的就是checked (勾选 or 未勾选，是布尔值)；2.配置input的value属性:(1)v-model的初始值是非数组，那么收集的就是checked
2023-03-21 10:13:09
30
原创 11_Vue条件渲染
Vue条件渲染1.V-if(1).v-if="表达式"(2).V-else-if="表达式"(3).V-else="表达式"适用于:切换频率较低的场景。特点:不展示的DOM元素直接被移除。注意: v-if可以和:v-else-if、v-else一起使用，但要求结构不能被“打断”。v-if可以搭配template使用，不会改变结构，template不能把和v-show搭配使用。2.V-show写法:v-show="表达式"适用于:切换频率较高的场景。特点:不展示的DOM元素未被移除，仅仅
2023-03-17 16:38:15
35
原创 10_Vue中class与style样式绑定
Vue中class与style样式绑定概述1. 在应用界面中，某个（些）元素的样式是变化的；2. class/style绑定就是专门用来实现永泰样式效果的技术。class 绑定1.class样式写法:class="xxx”xxx可以是字符串、对象、数组。字符串写法适用于:类名不确定，要动态获取。对象写法适用于:要绑定多个样式，个数不确定，名字也不确定。数组写法适用于:要绑定多个样式，个数确定，名字也确定，但不确定用不用。1 :class='xxx'2 表达式是字符串：'classA'
2023-03-17 15:37:54
209
原创 Vue中computed和watch之间的区别
computed和watch之间的区别1.computed能完成的功能，watch都可以完成。2.watch能完成的功能，computed不一定能完成，例如: watch可以进行异步操作。---两个重要的小原则1.所被Vue管理的函数，最好写成普通函数，这样this的指向才是vm 或 组件实例对象。2.所有不被Vue所管理的函数(定时器的回调函数、ajax的回调函数等)，最好写成箭头函数（箭头函数的this指向升级作用域的this），这样this的指向才是vm 或 组件实例对象。
2023-03-16 18:02:36
81
原创 09_Vue监视属性
Vue监视属性：监视属性watch1.当被监视的属性变化时，回调函数自动调用，进行相关操作；2.监视的属性必须存在，才能进行监视!!!3.监视的两种写法:(1)new Vue时传入watch配置(2)通过vm.$watch监视
2023-03-16 17:17:34
53
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人